Updated quickshell overview to current version

Signed-off-by: Don Williams <Don.e.williams@gmail.com> On branch development Your branch is up to date with 'origin/development'. Changes to be committed: modified: CHANGELOG.md new file: config/quickshell/overview-bak/README.md new file: config/quickshell/overview-bak/assets/image.png new file: config/quickshell/overview-bak/common/Appearance.qml new file: config/quickshell/overview-bak/common/Config.qml new file: config/quickshell/overview-bak/common/functions/ColorUtils.qml new file: config/quickshell/overview-bak/common/functions/qmldir new file: config/quickshell/overview-bak/common/qmldir new file: config/quickshell/overview-bak/common/widgets/StyledRectangularShadow.qml new file: config/quickshell/overview-bak/common/widgets/StyledText.qml new file: config/quickshell/overview-bak/common/widgets/StyledToolTip.qml new file: config/quickshell/overview-bak/common/widgets/StyledToolTipContent.qml new file: config/quickshell/overview-bak/common/widgets/qmldir new file: config/quickshell/overview-bak/modules/overview/Overview.qml new file: config/quickshell/overview-bak/modules/overview/OverviewWidget.qml new file: config/quickshell/overview-bak/modules/overview/OverviewWindow.qml new file: config/quickshell/overview-bak/modules/overview/qmldir new file: config/quickshell/overview-bak/services/GlobalStates.qml new file: config/quickshell/overview-bak/services/HyprlandData.qml new file: config/quickshell/overview-bak/services/qmldir new file: config/quickshell/overview-bak/shell.qml new file: config/quickshell/overview/.github/FUNDING.yml modified: config/quickshell/overview/README.md new file: config/quickshell/overview/assets/Workspace_Wallpaper.png modified: config/quickshell/overview/assets/image.png modified: config/quickshell/overview/common/Appearance.qml modified: config/quickshell/overview/common/Config.qml new file: config/quickshell/overview/config.example.json modified: config/quickshell/overview/modules/overview/Overview.qml modified: config/quickshell/overview/modules/overview/OverviewWidget.qml modified: config/quickshell/overview/modules/overview/OverviewWindow.qml new file: config/quickshell/overview/quickshell-overview.qml modified: config/quickshell/overview/services/HyprlandData.qml modified: config/quickshell/overview/shell.qml
author: Don Williams <Don.e.williams@gmail.com> 2026-07-04 17:28:36 -0400
committer: Pinapelz <yukais@pinapelz.com> 2026-08-29 21:39:35 -0700
commit: e974676da74ca270b289f789ae055e3a9b4012fe (patch)
tree: e43881adb8d2ab15b85d009e7ad85999d6f61416 /config
parent: 2f4b617fbb4214e50ae0bc44fd4acb5385731c75 (diff)
33 files changed, 3751 insertions, 199 deletions
diff --git a/config/quickshell/overview-bak/README.md b/config/quickshell/overview-bak/README.md
new file mode 100644
index 00000000..c32e7ac5
--- /dev/null
+++ b/config/quickshell/overview-bak/README.md
@@ -0,0 +1,214 @@
+# Quickshell Overview for Hyprland
+
+<div align="center">
+
+A standalone workspace overview module for Hyprland using Quickshell - shows all workspaces with live window previews, drag-and-drop support, and Super+Tab keybind.
+
+![Quickshell](https://img.shields.io/badge/Quickshell-0.2.0-blue?style=flat-square)
+![Hyprland](https://img.shields.io/badge/Hyprland-Compatible-purple?style=flat-square)
+![Qt6](https://img.shields.io/badge/Qt-6-green?style=flat-square)
+![License](https://img.shields.io/badge/License-GPL-orange?style=flat-square)
+
+</div>
+
+---
+
+## 📸 Preview
+
+![Overview Screenshot](assets/image.png)
+
+https://github.com/user-attachments/assets/79ceb141-6b9e-4956-8e09-aaf72b66550c
+
+> *Workspace overview showing live window previews with drag-and-drop support*
+
+---
+
+## ✨ Features
+
+- 🖼️ Visual workspace overview showing all workspaces and windows
+- 🎯 Click windows to focus them
+- 🖱️ Middle-click windows to close them  
+- 🔄 Drag and drop windows between workspaces
+- ⌨️ Keyboard navigation (Arrow keys to switch workspaces, Escape/Enter to close)
+- 💡 Hover tooltips showing window information
+- 🎨 Material Design 3 theming
+- ⚡ Smooth animations and transitions
+
+## 📦 Installation
+
+### Prerequisites
+
+- **Hyprland** compositor
+- **Quickshell** ([installation guide](https://quickshell.org/docs/v0.1.0/guide/install-setup/))
+- **Qt 6** with modules: QtQuick, QtQuick.Controls, Qt5Compat.GraphicalEffects
+
+### Setup
+
+1. **Clone this repository** to your Quickshell config directory:
+   ```bash
+   git clone https://github.com/Shanu-Kumawat/quickshell-overview ~/.config/quickshell/overview
+   ```
+
+2. **Add keybind** to your Hyprland config (`~/.config/hypr/hyprland.conf`):
+   ```conf
+   bind = Super, TAB, exec, qs ipc -c overview call overview toggle
+   ```
+
+3. **Auto-start** the overview (add to Hyprland config):
+   ```conf
+   exec-once = qs -c overview
+   ```
+
+4. **Reload Hyprland**:
+   ```bash
+   hyprctl reload
+   ```
+
+### Manual Start (if needed)
+
+```bash
+qs -c overview &
+```
+
+## 🎮 Usage
+
+| Action | Description |
+|--------|-------------|
+| **Super + Tab** | Toggle the overview |
+| **Left/Right Arrow Keys** | Navigate between workspaces horizontally |
+| **Up/Down Arrow Keys** | Navigate between workspace rows |
+| **Escape / Enter** | Close the overview |
+| **Click workspace** | Switch to that workspace |
+| **Click window** | Focus that window |
+| **Middle-click window** | Close that window |
+| **Drag window** | Move window to different workspace |
+
+---
+
+## ⚙️ Configuration
+
+> **⚠️ Want to change the size, position, or number of workspaces?**  
+> Edit `~/.config/quickshell/overview/common/Config.qml` - it's all there!
+
+### Workspace Grid
+
+Edit `~/.config/quickshell/overview/common/Config.qml`:
+
+```qml
+property QtObject overview: QtObject {
+    property int rows: 2        // Number of workspace rows
+    property int columns: 5     // Number of workspace columns (10 total workspaces)
+    property real scale: 0.16   // Overview scale factor (0.1-0.3, smaller = more compact)
+    property bool enable: true
+}
+```
+
+**Common adjustments:**
+- **Too small?** Increase `scale` (try 0.20 or 0.25)
+- **Too big?** Decrease `scale` (try 0.12 or 0.14)
+- **More workspaces?** Change `rows` and `columns` (e.g., 3 rows × 4 columns = 12 workspaces)
+
+### Position
+
+Edit `~/.config/quickshell/overview/modules/overview/Overview.qml` (line ~111):
+
+```qml
+anchors {
+    horizontalCenter: parent.horizontalCenter
+    top: parent.top
+    topMargin: 100  // Change this value to move up/down
+}
+```
+
+### Theme & Colors
+
+Edit `~/.config/quickshell/overview/common/Appearance.qml` to customize:
+- Colors (m3colors and colors objects)
+- Font families and sizes  
+- Animation curves and durations
+- Border radius values
+
+---
+
+## 📋 Requirements
+
+- **Hyprland** compositor (tested on latest versions)
+- **Quickshell** (Qt6-based shell framework)
+- **Qt 6** with the following modules:
+  - QtQuick
+  - QtQuick.Controls
+  - QtQuick.Layouts
+  - Qt5Compat.GraphicalEffects
+  - Quickshell.Wayland
+  - Quickshell.Hyprland
+
+## 🚫 Removed Features (from original illogical-impulse)
+
+The following features were removed to make it standalone:
+
+- App search functionality
+- Emoji picker
+- Clipboard history integration
+- Search widget
+- Integration with the full illogical-impulse shell ecosystem
+
+## 📁 File Structure
+
+```
+~/.config/quickshell/overview/
+├── shell.qml                      # Main entry point
+├── README.md                      # This file
+├── hyprland-config.conf          # Configuration reference
+├── common/
+│   ├── Appearance.qml            # Theme and styling
+│   ├── Config.qml                # Configuration options
+│   ├── functions/
+│   │   └── ColorUtils.qml        # Color manipulation utilities
+│   └── widgets/
+│       ├── StyledText.qml        # Styled text component
+│       ├── StyledRectangularShadow.qml
+│       ├── StyledToolTip.qml
+│       └── StyledToolTipContent.qml
+├── services/
+│   ├── GlobalStates.qml          # Global state management
+│   └── HyprlandData.qml          # Hyprland data provider
+└── modules/
+    └── overview/
+        ├── Overview.qml          # Main overview component
+        ├── OverviewWidget.qml    # Workspace grid widget
+        └── OverviewWindow.qml    # Individual window preview
+```
+
+## 🎯 IPC Commands
+
+```bash
+# Toggle overview
+qs ipc -c overview call overview toggle
+
+# Open overview
+qs ipc -c overview call overview open
+
+# Close overview  
+qs ipc -c overview call overview close
+```
+
+## 🐛 Known Issues
+
+- Window icons may fallback to generic icon if app class name doesn't match icon theme
+- Potential crashes during rapid window state changes due to Wayland screencopy buffer management
+
+##  Credits
+
+Extracted from the overview feature in [illogical-impulse](https://github.com/end-4/dots-hyprland) by [end-4](https://github.com/end-4).
+
+Adapted as a standalone component for Hyprland + Quickshell users who want just the overview functionality.
+
+---
+
+<div align="center">
+
+**Note:** Maintenance will be limited due to time constraints, but **PRs and code improvements are welcome!** Feel free to contribute or fork for your own needs.
+
+Made with ❤️ for the Hyprland community
+
+</div>
diff --git a/config/quickshell/overview-bak/assets/image.png b/config/quickshell/overview-bak/assets/image.png
new file mode 100644
index 00000000..91db17cb
--- /dev/null
+++ b/config/quickshell/overview-bak/assets/image.png
diff --git a/config/quickshell/overview-bak/common/Appearance.qml b/config/quickshell/overview-bak/common/Appearance.qml
new file mode 100644
index 00000000..79a30b44
--- /dev/null
+++ b/config/quickshell/overview-bak/common/Appearance.qml
@@ -0,0 +1,148 @@
+pragma Singleton
+pragma ComponentBehavior: Bound
+
+import QtQuick
+import Quickshell
+import "functions"
+
+Singleton {
+    id: root
+    property QtObject m3colors
+    property QtObject animation
+    property QtObject animationCurves
+    property QtObject colors
+    property QtObject rounding
+    property QtObject font
+    property QtObject sizes
+
+    m3colors: QtObject {
+        property bool darkmode: true
+        property color m3primary: "#E5B6F2"
+        property color m3onPrimary: "#452152"
+        property color m3primaryContainer: "#5D386A"
+        property color m3onPrimaryContainer: "#F9D8FF"
+        property color m3secondary: "#D5C0D7"
+        property color m3onSecondary: "#392C3D"
+        property color m3secondaryContainer: "#534457"
+        property color m3onSecondaryContainer: "#F2DCF3"
+        property color m3background: "#161217"
+        property color m3onBackground: "#EAE0E7"
+        property color m3surface: "#161217"
+        property color m3surfaceContainerLow: "#1F1A1F"
+        property color m3surfaceContainer: "#231E23"
+        property color m3surfaceContainerHigh: "#2D282E"
+        property color m3surfaceContainerHighest: "#383339"
+        property color m3onSurface: "#EAE0E7"
+        property color m3surfaceVariant: "#4C444D"
+        property color m3onSurfaceVariant: "#CFC3CD"
+        property color m3inverseSurface: "#EAE0E7"
+        property color m3inverseOnSurface: "#342F34"
+        property color m3outline: "#988E97"
+        property color m3outlineVariant: "#4C444D"
+        property color m3shadow: "#000000"
+    }
+
+    colors: QtObject {
+        property color colSubtext: m3colors.m3outline
+        property color colLayer0: m3colors.m3background
+        property color colOnLayer0: m3colors.m3onBackground
+        property color colLayer0Border: ColorUtils.mix(root.m3colors.m3outlineVariant, colLayer0, 0.4)
+        property color colLayer1: m3colors.m3surfaceContainerLow
+        property color colOnLayer1: m3colors.m3onSurfaceVariant
+        property color colOnLayer1Inactive: ColorUtils.mix(colOnLayer1, colLayer1, 0.45)
+        property color colLayer1Hover: ColorUtils.mix(colLayer1, colOnLayer1, 0.92)
+        property color colLayer1Active: ColorUtils.mix(colLayer1, colOnLayer1, 0.85)
+        property color colLayer2: m3colors.m3surfaceContainer
+        property color colOnLayer2: m3colors.m3onSurface
+        property color colLayer2Hover: ColorUtils.mix(colLayer2, colOnLayer2, 0.90)
+        property color colLayer2Active: ColorUtils.mix(colLayer2, colOnLayer2, 0.80)
+        property color colPrimary: m3colors.m3primary
+        property color colOnPrimary: m3colors.m3onPrimary
+        property color colSecondary: m3colors.m3secondary
+        property color colSecondaryContainer: m3colors.m3secondaryContainer
+        property color colOnSecondaryContainer: m3colors.m3onSecondaryContainer
+        property color colTooltip: m3colors.m3inverseSurface
+        property color colOnTooltip: m3colors.m3inverseOnSurface
+        property color colShadow: ColorUtils.transparentize(m3colors.m3shadow, 0.7)
+        property color colOutline: m3colors.m3outline
+    }
+
+    rounding: QtObject {
+        property int unsharpen: 2
+        property int verysmall: 8
+        property int small: 12
+        property int normal: 17
+        property int large: 23
+        property int full: 9999
+        property int screenRounding: large
+        property int windowRounding: 18
+    }
+
+    font: QtObject {
+        property QtObject family: QtObject {
+            property string main: "sans-serif"
+            property string title: "sans-serif"
+            property string expressive: "sans-serif"
+        }
+        property QtObject pixelSize: QtObject {
+            property int smaller: 12
+            property int small: 15
+            property int normal: 16
+            property int larger: 19
+            property int huge: 22
+        }
+    }
+
+    animationCurves: QtObject {
+        readonly property list<real> expressiveDefaultSpatial: [0.38, 1.21, 0.22, 1.00, 1, 1]
+        readonly property list<real> expressiveEffects: [0.34, 0.80, 0.34, 1.00, 1, 1]
+        readonly property list<real> emphasizedDecel: [0.05, 0.7, 0.1, 1, 1, 1]
+        readonly property real expressiveDefaultSpatialDuration: 500
+        readonly property real expressiveEffectsDuration: 200
+    }
+
+    animation: QtObject {
+        property QtObject elementMove: QtObject {
+            property int duration: animationCurves.expressiveDefaultSpatialDuration
+            property int type: Easing.BezierSpline
+            property list<real> bezierCurve: animationCurves.expressiveDefaultSpatial
+            property Component numberAnimation: Component {
+                NumberAnimation {
+                    duration: root.animation.elementMove.duration
+                    easing.type: root.animation.elementMove.type
+                    easing.bezierCurve: root.animation.elementMove.bezierCurve
+                }
+            }
+        }
+
+        property QtObject elementMoveEnter: QtObject {
+            property int duration: 400
+            property int type: Easing.BezierSpline
+            property list<real> bezierCurve: animationCurves.emphasizedDecel
+            property Component numberAnimation: Component {
+                NumberAnimation {
+                    duration: root.animation.elementMoveEnter.duration
+                    easing.type: root.animation.elementMoveEnter.type
+                    easing.bezierCurve: root.animation.elementMoveEnter.bezierCurve
+                }
+            }
+        }
+
+        property QtObject elementMoveFast: QtObject {
+            property int duration: animationCurves.expressiveEffectsDuration
+            property int type: Easing.BezierSpline
+            property list<real> bezierCurve: animationCurves.expressiveEffects
+            property Component numberAnimation: Component {
+                NumberAnimation {
+                    duration: root.animation.elementMoveFast.duration
+                    easing.type: root.animation.elementMoveFast.type
+                    easing.bezierCurve: root.animation.elementMoveFast.bezierCurve
+                }
+            }
+        }
+    }
+
+    sizes: QtObject {
+        property real elevationMargin: 10
+    }
+}
diff --git a/config/quickshell/overview-bak/common/Config.qml b/config/quickshell/overview-bak/common/Config.qml
new file mode 100644
index 00000000..48601dd3
--- /dev/null
+++ b/config/quickshell/overview-bak/common/Config.qml
@@ -0,0 +1,22 @@
+pragma Singleton
+pragma ComponentBehavior: Bound
+
+import QtQuick
+import Quickshell
+
+Singleton {
+    id: root
+    
+    property QtObject options: QtObject {
+        property QtObject overview: QtObject {
+            property int rows: 2
+            property int columns: 5
+            property real scale: 0.16
+            property bool enable: true
+        }
+        
+        property QtObject hacks: QtObject {
+            property int arbitraryRaceConditionDelay: 150
+        }
+    }
+}
diff --git a/config/quickshell/overview-bak/common/functions/ColorUtils.qml b/config/quickshell/overview-bak/common/functions/ColorUtils.qml
new file mode 100644
index 00000000..6162df18
--- /dev/null
+++ b/config/quickshell/overview-bak/common/functions/ColorUtils.qml
@@ -0,0 +1,68 @@
+pragma Singleton
+import Quickshell
+
+Singleton {
+    id: root
+
+    function colorWithHueOf(color1, color2) {
+        var c1 = Qt.color(color1);
+        var c2 = Qt.color(color2);
+        var hue = c2.hsvHue;
+        var sat = c1.hsvSaturation;
+        var val = c1.hsvValue;
+        var alpha = c1.a;
+        return Qt.hsva(hue, sat, val, alpha);
+    }
+
+    function colorWithSaturationOf(color1, color2) {
+        var c1 = Qt.color(color1);
+        var c2 = Qt.color(color2);
+        var hue = c1.hsvHue;
+        var sat = c2.hsvSaturation;
+        var val = c1.hsvValue;
+        var alpha = c1.a;
+        return Qt.hsva(hue, sat, val, alpha);
+    }
+
+    function colorWithLightness(color, lightness) {
+        var c = Qt.color(color);
+        return Qt.hsla(c.hslHue, c.hslSaturation, lightness, c.a);
+    }
+
+    function colorWithLightnessOf(color1, color2) {
+        var c2 = Qt.color(color2);
+        return colorWithLightness(color1, c2.hslLightness);
+    }
+
+    function adaptToAccent(color1, color2) {
+        var c1 = Qt.color(color1);
+        var c2 = Qt.color(color2);
+        var hue = c2.hslHue;
+        var sat = c2.hslSaturation;
+        var light = c1.hslLightness;
+        var alpha = c1.a;
+        return Qt.hsla(hue, sat, light, alpha);
+    }
+
+    function mix(color1, color2, percentage = 0.5) {
+        var c1 = Qt.color(color1);
+        var c2 = Qt.color(color2);
+        return Qt.rgba(
+            percentage * c1.r + (1 - percentage) * c2.r,
+            percentage * c1.g + (1 - percentage) * c2.g,
+            percentage * c1.b + (1 - percentage) * c2.b,
+            percentage * c1.a + (1 - percentage) * c2.a
+        );
+    }
+
+    function transparentize(color, percentage = 1) {
+        var c = Qt.color(color);
+        return Qt.rgba(c.r, c.g, c.b, c.a * (1 - percentage));
+    }
+
+    function applyAlpha(color, alpha) {
+        var c = Qt.color(color);
+        var a = Math.max(0, Math.min(1, alpha));
+        return Qt.rgba(c.r, c.g, c.b, a);
+    }
+}
diff --git a/config/quickshell/overview-bak/common/functions/qmldir b/config/quickshell/overview-bak/common/functions/qmldir
new file mode 100644
index 00000000..4c648e7e
--- /dev/null
+++ b/config/quickshell/overview-bak/common/functions/qmldir
@@ -0,0 +1 @@
+singleton ColorUtils 1.0 ColorUtils.qml
diff --git a/config/quickshell/overview-bak/common/qmldir b/config/quickshell/overview-bak/common/qmldir
new file mode 100644
index 00000000..a8485188
--- /dev/null
+++ b/config/quickshell/overview-bak/common/qmldir
@@ -0,0 +1,7 @@
+singleton Appearance 1.0 Appearance.qml
+singleton Config 1.0 Config.qml
+singleton ColorUtils 1.0 functions/ColorUtils.qml
+StyledText 1.0 widgets/StyledText.qml
+StyledRectangularShadow 1.0 widgets/StyledRectangularShadow.qml
+StyledToolTip 1.0 widgets/StyledToolTip.qml
+StyledToolTipContent 1.0 widgets/StyledToolTipContent.qml
diff --git a/config/quickshell/overview-bak/common/widgets/StyledRectangularShadow.qml b/config/quickshell/overview-bak/common/widgets/StyledRectangularShadow.qml
new file mode 100644
index 00000000..ccdff1ac
--- /dev/null
+++ b/config/quickshell/overview-bak/common/widgets/StyledRectangularShadow.qml
@@ -0,0 +1,14 @@
+import QtQuick
+import QtQuick.Effects
+import ".."
+
+RectangularShadow {
+    required property var target
+    anchors.fill: target
+    radius: 20
+    blur: 0.9 * Appearance.sizes.elevationMargin
+    offset: Qt.vector2d(0.0, 1.0)
+    spread: 1
+    color: Appearance.colors.colShadow
+    cached: true
+}
diff --git a/config/quickshell/overview-bak/common/widgets/StyledText.qml b/config/quickshell/overview-bak/common/widgets/StyledText.qml
new file mode 100644
index 00000000..abfcefae
--- /dev/null
+++ b/config/quickshell/overview-bak/common/widgets/StyledText.qml
@@ -0,0 +1,16 @@
+import QtQuick
+import ".."
+
+Text {
+    id: root
+    property bool animateChange: false
+
+    renderType: Text.NativeRendering
+    verticalAlignment: Text.AlignVCenter
+    font {
+        hintingPreference: Font.PreferFullHinting
+        family: Appearance?.font.family.main ?? "sans-serif"
+        pixelSize: Appearance?.font.pixelSize.small ?? 15
+    }
+    color: Appearance?.m3colors.m3onBackground ?? "white"
+}
diff --git a/config/quickshell/overview-bak/common/widgets/StyledToolTip.qml b/config/quickshell/overview-bak/common/widgets/StyledToolTip.qml
new file mode 100644
index 00000000..4d4678c8
--- /dev/null
+++ b/config/quickshell/overview-bak/common/widgets/StyledToolTip.qml
@@ -0,0 +1,23 @@
+import QtQuick
+import QtQuick.Controls
+import "."
+
+ToolTip {
+    id: root
+    property bool extraVisibleCondition: true
+    property bool alternativeVisibleCondition: false
+    readonly property bool internalVisibleCondition: (extraVisibleCondition && (parent.hovered === undefined || parent?.hovered)) || alternativeVisibleCondition
+    verticalPadding: 5
+    horizontalPadding: 10
+    background: null
+
+    visible: internalVisibleCondition
+    
+    contentItem: StyledToolTipContent {
+        id: contentItem
+        text: root.text
+        shown: root.internalVisibleCondition
+        horizontalPadding: root.horizontalPadding
+        verticalPadding: root.verticalPadding
+    }
+}
diff --git a/config/quickshell/overview-bak/common/widgets/StyledToolTipContent.qml b/config/quickshell/overview-bak/common/widgets/StyledToolTipContent.qml
new file mode 100644
index 00000000..b8c29c1a
--- /dev/null
+++ b/config/quickshell/overview-bak/common/widgets/StyledToolTipContent.qml
@@ -0,0 +1,49 @@
+import QtQuick
+import "."
+import "../"
+
+Item {
+    id: root
+    required property string text
+    property bool shown: false
+    property real horizontalPadding: 10
+    property real verticalPadding: 5
+    implicitWidth: tooltipTextObject.implicitWidth + 2 * root.horizontalPadding
+    implicitHeight: tooltipTextObject.implicitHeight + 2 * root.verticalPadding
+
+    property bool isVisible: backgroundRectangle.implicitHeight > 0
+
+    Rectangle {
+        id: backgroundRectangle
+        anchors {
+            bottom: root.bottom
+            horizontalCenter: root.horizontalCenter
+        }
+        color: Appearance?.colors.colTooltip ?? "#3C4043"
+        radius: Appearance?.rounding.verysmall ?? 7
+        opacity: shown ? 1 : 0
+        implicitWidth: shown ? (tooltipTextObject.implicitWidth + 2 * root.horizontalPadding) : 0
+        implicitHeight: shown ? (tooltipTextObject.implicitHeight + 2 * root.verticalPadding) : 0
+        clip: true
+
+        Behavior on implicitWidth {
+            animation: Appearance?.animation.elementMoveFast.numberAnimation.createObject(this)
+        }
+        Behavior on implicitHeight {
+            animation: Appearance?.animation.elementMoveFast.numberAnimation.createObject(this)
+        }
+        Behavior on opacity {
+            animation: Appearance?.animation.elementMoveFast.numberAnimation.createObject(this)
+        }
+
+        StyledText {
+            id: tooltipTextObject
+            anchors.centerIn: parent
+            text: root.text
+            font.pixelSize: Appearance?.font.pixelSize.smaller ?? 14
+            font.hintingPreference: Font.PreferNoHinting
+            color: Appearance?.colors.colOnTooltip ?? "#FFFFFF"
+            wrapMode: Text.Wrap
+        }
+    }   
+}
diff --git a/config/quickshell/overview-bak/common/widgets/qmldir b/config/quickshell/overview-bak/common/widgets/qmldir
new file mode 100644
index 00000000..0efe1360
--- /dev/null
+++ b/config/quickshell/overview-bak/common/widgets/qmldir
@@ -0,0 +1,4 @@
+StyledText 1.0 StyledText.qml
+StyledRectangularShadow 1.0 StyledRectangularShadow.qml
+StyledToolTip 1.0 StyledToolTip.qml
+StyledToolTipContent 1.0 StyledToolTipContent.qml
diff --git a/config/quickshell/overview-bak/modules/overview/Overview.qml b/config/quickshell/overview-bak/modules/overview/Overview.qml
new file mode 100644
index 00000000..b3a299cb
--- /dev/null
+++ b/config/quickshell/overview-bak/modules/overview/Overview.qml
@@ -0,0 +1,147 @@
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+import Quickshell
+import Quickshell.Io
+import Quickshell.Wayland
+import Quickshell.Hyprland
+import "../../common"
+import "../../services"
+import "."
+
+Scope {
+    id: overviewScope
+    Variants {
+        id: overviewVariants
+        model: Quickshell.screens
+        PanelWindow {
+            id: root
+            required property var modelData
+            readonly property HyprlandMonitor monitor: Hyprland.monitorFor(root.screen)
+            property bool monitorIsFocused: (Hyprland.focusedMonitor?.id == monitor?.id)
+            screen: modelData
+            visible: GlobalStates.overviewOpen
+
+            WlrLayershell.namespace: "quickshell:overview"
+            WlrLayershell.layer: WlrLayer.Overlay
+            WlrLayershell.keyboardFocus: WlrKeyboardFocus.Exclusive
+            color: "transparent"
+
+            mask: Region {
+                item: GlobalStates.overviewOpen ? keyHandler : null
+            }
+
+            anchors {
+                top: true
+                bottom: true
+                left: !(Config?.options.overview.enable ?? true) 
+                right: !(Config?.options.overview.enable ?? true) 
+            }
+
+            HyprlandFocusGrab {
+                id: grab
+                windows: [root]
+                property bool canBeActive: root.monitorIsFocused
+                active: false
+                onCleared: () => {
+                    if (!active)
+                        GlobalStates.overviewOpen = false;
+                }
+            }
+
+            Connections {
+                target: GlobalStates
+                function onOverviewOpenChanged() {
+                    if (GlobalStates.overviewOpen) {
+                        delayedGrabTimer.start();
+                    }
+                }
+            }
+
+            Timer {
+                id: delayedGrabTimer
+                interval: Config.options.hacks.arbitraryRaceConditionDelay
+                repeat: false
+                onTriggered: {
+                    if (!grab.canBeActive)
+                        return;
+                    grab.active = GlobalStates.overviewOpen;
+                }
+            }
+
+            implicitWidth: columnLayout.implicitWidth
+            implicitHeight: columnLayout.implicitHeight
+
+            Item {
+                id: keyHandler
+                anchors.fill: parent
+                visible: GlobalStates.overviewOpen
+                focus: GlobalStates.overviewOpen
+
+                Keys.onPressed: event => {
+                    if (event.key === Qt.Key_Escape || event.key === Qt.Key_Return) {
+                        GlobalStates.overviewOpen = false;
+                        event.accepted = true;
+                    } else if (event.key === Qt.Key_Left || event.key === Qt.Key_Right || event.key === Qt.Key_Up || event.key === Qt.Key_Down) {
+                        const workspacesPerGroup = Config.options.overview.rows * Config.options.overview.columns;
+                        const currentId = Hyprland.focusedMonitor?.activeWorkspace?.id ?? 1;
+                        const currentGroup = Math.floor((currentId - 1) / workspacesPerGroup);
+                        const minWorkspaceId = currentGroup * workspacesPerGroup + 1;
+                        const maxWorkspaceId = minWorkspaceId + workspacesPerGroup - 1;
+                        
+                        let targetId;
+                        if (event.key === Qt.Key_Left) {
+                            targetId = currentId - 1;
+                            if (targetId < minWorkspaceId) targetId = maxWorkspaceId;
+                        } else if (event.key === Qt.Key_Right) {
+                            targetId = currentId + 1;
+                            if (targetId > maxWorkspaceId) targetId = minWorkspaceId;
+                        } else if (event.key === Qt.Key_Up) {
+                            targetId = currentId - Config.options.overview.columns;
+                            if (targetId < minWorkspaceId) targetId += workspacesPerGroup;
+                        } else {
+                            targetId = currentId + Config.options.overview.columns;
+                            if (targetId > maxWorkspaceId) targetId -= workspacesPerGroup;
+                        }
+                        
+                        Hyprland.dispatch("workspace " + targetId);
+                        event.accepted = true;
+                    }
+                }
+            }
+
+            ColumnLayout {
+                id: columnLayout
+                visible: GlobalStates.overviewOpen
+                anchors {
+                    horizontalCenter: parent.horizontalCenter
+                    top: parent.top
+                    topMargin: 100
+                }
+
+                Loader {
+                    id: overviewLoader
+                    active: GlobalStates.overviewOpen && (Config?.options.overview.enable ?? true)
+                    sourceComponent: OverviewWidget {
+                        panelWindow: root
+                        visible: true
+                    }
+                }
+            }
+        }
+    }
+    
+    IpcHandler {
+        target: "overview"
+
+        function toggle() {
+            GlobalStates.overviewOpen = !GlobalStates.overviewOpen;
+        }
+        function close() {
+            GlobalStates.overviewOpen = false;
+        }
+        function open() {
+            GlobalStates.overviewOpen = true;
+        }
+    }
+}
diff --git a/config/quickshell/overview-bak/modules/overview/OverviewWidget.qml b/config/quickshell/overview-bak/modules/overview/OverviewWidget.qml
new file mode 100644
index 00000000..7defa64d
--- /dev/null
+++ b/config/quickshell/overview-bak/modules/overview/OverviewWidget.qml
@@ -0,0 +1,303 @@
+import QtQuick
+import QtQuick.Layouts
+import Quickshell
+import Quickshell.Wayland
+import Quickshell.Hyprland
+import "../../common"
+import "../../common/functions"
+import "../../common/widgets"
+import "../../services"
+import "."
+
+Item {
+    id: root
+    required property var panelWindow
+    readonly property HyprlandMonitor monitor: Hyprland.monitorFor(panelWindow.screen)
+    readonly property var toplevels: ToplevelManager.toplevels
+    readonly property int workspacesShown: Config.options.overview.rows * Config.options.overview.columns
+    readonly property int workspaceGroup: Math.floor((monitor.activeWorkspace?.id - 1) / workspacesShown)
+    property bool monitorIsFocused: (Hyprland.focusedMonitor?.name == monitor.name)
+    property var windows: HyprlandData.windowList
+    property var windowByAddress: HyprlandData.windowByAddress
+    property var windowAddresses: HyprlandData.addresses
+    property var monitorData: HyprlandData.monitors.find(m => m.id === root.monitor?.id)
+    property real scale: Config.options.overview.scale
+    property color activeBorderColor: Appearance.colors.colSecondary
+
+    property real workspaceImplicitWidth: (monitorData?.transform % 2 === 1) ? 
+        ((monitor.height / monitor.scale - (monitorData?.reserved?.[0] ?? 0) - (monitorData?.reserved?.[2] ?? 0)) * root.scale) :
+        ((monitor.width / monitor.scale - (monitorData?.reserved?.[0] ?? 0) - (monitorData?.reserved?.[2] ?? 0)) * root.scale)
+    property real workspaceImplicitHeight: (monitorData?.transform % 2 === 1) ? 
+        ((monitor.width / monitor.scale - (monitorData?.reserved?.[1] ?? 0) - (monitorData?.reserved?.[3] ?? 0)) * root.scale) :
+        ((monitor.height / monitor.scale - (monitorData?.reserved?.[1] ?? 0) - (monitorData?.reserved?.[3] ?? 0)) * root.scale)
+
+    property real workspaceNumberMargin: 80
+    property real workspaceNumberSize: 250 * monitor.scale
+    property int workspaceZ: 0
+    property int windowZ: 1
+    property int windowDraggingZ: 99999
+    property real workspaceSpacing: 5
+
+    property int draggingFromWorkspace: -1
+    property int draggingTargetWorkspace: -1
+
+    implicitWidth: overviewBackground.implicitWidth + Appearance.sizes.elevationMargin * 2
+    implicitHeight: overviewBackground.implicitHeight + Appearance.sizes.elevationMargin * 2
+
+    property Component windowComponent: OverviewWindow {}
+    property list<OverviewWindow> windowWidgets: []
+
+    StyledRectangularShadow {
+        target: overviewBackground
+    }
+    Rectangle { // Background
+        id: overviewBackground
+        property real padding: 10
+        anchors.fill: parent
+        anchors.margins: Appearance.sizes.elevationMargin
+
+        implicitWidth: workspaceColumnLayout.implicitWidth + padding * 2
+        implicitHeight: workspaceColumnLayout.implicitHeight + padding * 2
+        radius: Appearance.rounding.screenRounding * root.scale + padding
+        color: Appearance.colors.colLayer0
+        border.width: 1
+        border.color: Appearance.colors.colLayer0Border
+
+        ColumnLayout { // Workspaces
+            id: workspaceColumnLayout
+
+            z: root.workspaceZ
+            anchors.centerIn: parent
+            spacing: workspaceSpacing
+            Repeater {
+                model: Config.options.overview.rows
+                delegate: RowLayout {
+                    id: row
+                    property int rowIndex: index
+                    spacing: workspaceSpacing
+
+                    Repeater { // Workspace repeater
+                        model: Config.options.overview.columns
+                        Rectangle { // Workspace
+                            id: workspace
+                            property int colIndex: index
+                            property int workspaceValue: root.workspaceGroup * workspacesShown + rowIndex * Config.options.overview.columns + colIndex + 1
+                            property color defaultWorkspaceColor: Appearance.colors.colLayer1
+                            property color hoveredWorkspaceColor: ColorUtils.mix(defaultWorkspaceColor, Appearance.colors.colLayer1Hover, 0.1)
+                            property color hoveredBorderColor: Appearance.colors.colLayer2Hover
+                            property bool hoveredWhileDragging: false
+
+                            implicitWidth: root.workspaceImplicitWidth
+                            implicitHeight: root.workspaceImplicitHeight
+                            color: hoveredWhileDragging ? hoveredWorkspaceColor : defaultWorkspaceColor
+                            radius: Appearance.rounding.screenRounding * root.scale
+                            border.width: 2
+                            border.color: hoveredWhileDragging ? hoveredBorderColor : "transparent"
+
+                            StyledText {
+                                anchors.centerIn: parent
+                                text: workspaceValue
+                                font {
+                                    pixelSize: root.workspaceNumberSize * root.scale
+                                    weight: Font.DemiBold
+                                    family: Appearance.font.family.expressive
+                                }
+                                color: ColorUtils.transparentize(Appearance.colors.colOnLayer1, 0.8)
+                                horizontalAlignment: Text.AlignHCenter
+                                verticalAlignment: Text.AlignVCenter
+                            }
+
+                            MouseArea {
+                                id: workspaceArea
+                                anchors.fill: parent
+                                acceptedButtons: Qt.LeftButton
+                                onClicked: {
+                                    if (root.draggingTargetWorkspace === -1) {
+                                        GlobalStates.overviewOpen = false
+                                        Hyprland.dispatch(`workspace ${workspaceValue}`)
+                                    }
+                                }
+                            }
+
+                            DropArea {
+                                anchors.fill: parent
+                                onEntered: {
+                                    root.draggingTargetWorkspace = workspaceValue
+                                    if (root.draggingFromWorkspace == root.draggingTargetWorkspace) return;
+                                    hoveredWhileDragging = true
+                                }
+                                onExited: {
+                                    hoveredWhileDragging = false
+                                    if (root.draggingTargetWorkspace == workspaceValue) root.draggingTargetWorkspace = -1
+                                }
+                            }
+
+                        }
+                    }
+                }
+            }
+        }
+
+        Item { // Windows & focused workspace indicator
+            id: windowSpace
+            anchors.centerIn: parent
+            implicitWidth: workspaceColumnLayout.implicitWidth
+            implicitHeight: workspaceColumnLayout.implicitHeight
+
+            Repeater { // Window repeater
+                model: ScriptModel {
+                    values: {
+                        return ToplevelManager.toplevels.values.filter((toplevel) => {
+                            const address = `0x${toplevel.HyprlandToplevel.address}`
+                            var win = windowByAddress[address]
+                            const inWorkspaceGroup = (root.workspaceGroup * root.workspacesShown < win?.workspace?.id && win?.workspace?.id <= (root.workspaceGroup + 1) * root.workspacesShown)
+                            return inWorkspaceGroup;
+                        }).sort((a, b) => {
+                            // Proper stacking order based on Hyprland's window properties
+                            const addrA = `0x${a.HyprlandToplevel.address}`
+                            const addrB = `0x${b.HyprlandToplevel.address}`
+                            const winA = windowByAddress[addrA]
+                            const winB = windowByAddress[addrB]
+                            
+                            // 1. Pinned windows are always on top
+                            if (winA?.pinned !== winB?.pinned) {
+                                return winA?.pinned ? 1 : -1
+                            }
+                            
+                            // 2. Floating windows above tiled windows
+                            if (winA?.floating !== winB?.floating) {
+                                return winA?.floating ? 1 : -1
+                            }
+                            
+                            // 3. Within same category, sort by focus history
+                            // Lower focusHistoryID = more recently focused = higher in stack
+                            return (winB?.focusHistoryID ?? 0) - (winA?.focusHistoryID ?? 0)
+                        })
+                    }
+                }
+                delegate: OverviewWindow {
+                    id: window
+                    required property var modelData
+                    required property int index
+                    property int monitorId: windowData?.monitor
+                    property var monitor: HyprlandData.monitors.find(m => m.id === monitorId)
+                    property var address: `0x${modelData.HyprlandToplevel.address}`
+                    windowData: windowByAddress[address]
+                    toplevel: modelData
+                    monitorData: monitor
+                    
+                    // Calculate scale relative to window's source monitor
+                    property real sourceMonitorWidth: (monitor?.transform % 2 === 1) ? 
+                        (monitor?.height ?? 1920) / (monitor?.scale ?? 1) - (monitor?.reserved?.[0] ?? 0) - (monitor?.reserved?.[2] ?? 0) :
+                        (monitor?.width ?? 1920) / (monitor?.scale ?? 1) - (monitor?.reserved?.[0] ?? 0) - (monitor?.reserved?.[2] ?? 0)
+                    property real sourceMonitorHeight: (monitor?.transform % 2 === 1) ?
+                        (monitor?.width ?? 1080) / (monitor?.scale ?? 1) - (monitor?.reserved?.[1] ?? 0) - (monitor?.reserved?.[3] ?? 0) :
+                        (monitor?.height ?? 1080) / (monitor?.scale ?? 1) - (monitor?.reserved?.[1] ?? 0) - (monitor?.reserved?.[3] ?? 0)
+                    
+                    // Scale windows to fit the workspace size, accounting for different monitor sizes
+                    scale: Math.min(
+                        root.workspaceImplicitWidth / sourceMonitorWidth,
+                        root.workspaceImplicitHeight / sourceMonitorHeight
+                    )
+                    
+                    availableWorkspaceWidth: root.workspaceImplicitWidth
+                    availableWorkspaceHeight: root.workspaceImplicitHeight
+                    widgetMonitorId: root.monitor.id
+
+                    property bool atInitPosition: (initX == x && initY == y)
+
+                    property int workspaceColIndex: (windowData?.workspace.id - 1) % Config.options.overview.columns
+                    property int workspaceRowIndex: Math.floor((windowData?.workspace.id - 1) % root.workspacesShown / Config.options.overview.columns)
+                    xOffset: (root.workspaceImplicitWidth + workspaceSpacing) * workspaceColIndex
+                    yOffset: (root.workspaceImplicitHeight + workspaceSpacing) * workspaceRowIndex
+
+                    Timer {
+                        id: updateWindowPosition
+                        interval: Config.options.hacks.arbitraryRaceConditionDelay
+                        repeat: false
+                        running: false
+                        onTriggered: {
+                            window.x = Math.round(Math.max((windowData?.at[0] - (monitor?.x ?? 0) - (monitorData?.reserved?.[0] ?? 0)) * root.scale, 0) + xOffset)
+                            window.y = Math.round(Math.max((windowData?.at[1] - (monitor?.y ?? 0) - (monitorData?.reserved?.[1] ?? 0)) * root.scale, 0) + yOffset)
+                        }
+                    }
+
+                    z: atInitPosition ? (root.windowZ + index) : root.windowDraggingZ
+                    Drag.hotSpot.x: targetWindowWidth / 2
+                    Drag.hotSpot.y: targetWindowHeight / 2
+                    MouseArea {
+                        id: dragArea
+                        anchors.fill: parent
+                        hoverEnabled: true
+                        onEntered: hovered = true
+                        onExited: hovered = false
+                        acceptedButtons: Qt.LeftButton | Qt.MiddleButton
+                        drag.target: parent
+                        onPressed: (mouse) => {
+                            root.draggingFromWorkspace = windowData?.workspace.id
+                            window.pressed = true
+                            window.Drag.active = true
+                            window.Drag.source = window
+                            window.Drag.hotSpot.x = mouse.x
+                            window.Drag.hotSpot.y = mouse.y
+                        }
+                        onReleased: {
+                            const targetWorkspace = root.draggingTargetWorkspace
+                            window.pressed = false
+                            window.Drag.active = false
+                            root.draggingFromWorkspace = -1
+                            if (targetWorkspace !== -1 && targetWorkspace !== windowData?.workspace.id) {
+                                Hyprland.dispatch(`movetoworkspacesilent ${targetWorkspace}, address:${window.windowData?.address}`)
+                                updateWindowPosition.restart()
+                            }
+                            else {
+                                window.x = window.initX
+                                window.y = window.initY
+                            }
+                        }
+                        onClicked: (event) => {
+                            if (!windowData) return;
+
+                            if (event.button === Qt.LeftButton) {
+                                GlobalStates.overviewOpen = false
+                                Hyprland.dispatch(`focuswindow address:${windowData.address}`)
+                                event.accepted = true
+                            } else if (event.button === Qt.MiddleButton) {
+                                Hyprland.dispatch(`closewindow address:${windowData.address}`)
+                                event.accepted = true
+                            }
+                        }
+
+                        StyledToolTip {
+                            extraVisibleCondition: false
+                            alternativeVisibleCondition: dragArea.containsMouse && !window.Drag.active
+                            text: `${windowData?.title ?? "Unknown"}\n[${windowData?.class ?? "unknown"}] ${windowData?.xwayland ? "[XWayland] " : ""}`
+                        }
+                    }
+                }
+            }
+
+            Rectangle { // Focused workspace indicator
+                id: focusedWorkspaceIndicator
+                property int activeWorkspaceInGroup: monitor.activeWorkspace?.id - (root.workspaceGroup * root.workspacesShown)
+                property int activeWorkspaceRowIndex: Math.floor((activeWorkspaceInGroup - 1) / Config.options.overview.columns)
+                property int activeWorkspaceColIndex: (activeWorkspaceInGroup - 1) % Config.options.overview.columns
+                x: (root.workspaceImplicitWidth + workspaceSpacing) * activeWorkspaceColIndex
+                y: (root.workspaceImplicitHeight + workspaceSpacing) * activeWorkspaceRowIndex
+                z: root.windowZ
+                width: root.workspaceImplicitWidth
+                height: root.workspaceImplicitHeight
+                color: "transparent"
+                radius: Appearance.rounding.screenRounding * root.scale
+                border.width: 2
+                border.color: root.activeBorderColor
+                Behavior on x {
+                    animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
+                }
+                Behavior on y {
+                    animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
+                }
+            }
+        }
+    }
+}
diff --git a/config/quickshell/overview-bak/modules/overview/OverviewWindow.qml b/config/quickshell/overview-bak/modules/overview/OverviewWindow.qml
new file mode 100644
index 00000000..fac3e22e
--- /dev/null
+++ b/config/quickshell/overview-bak/modules/overview/OverviewWindow.qml
@@ -0,0 +1,112 @@
+import QtQuick.Effects
+import QtQuick
+import QtQuick.Layouts
+import Quickshell
+import Quickshell.Wayland
+import "../../common"
+import "../../common/functions"
+import "../../services"
+
+Item { // Window
+    id: root
+    property var toplevel
+    property var windowData
+    property var monitorData
+    property var scale
+    property var availableWorkspaceWidth
+    property var availableWorkspaceHeight
+    property bool restrictToWorkspace: true
+    property real initX: Math.max(((windowData?.at[0] ?? 0) - (monitorData?.x ?? 0) - (monitorData?.reserved?.[0] ?? 0)) * root.scale, 0) + xOffset
+    property real initY: Math.max(((windowData?.at[1] ?? 0) - (monitorData?.y ?? 0) - (monitorData?.reserved?.[1] ?? 0)) * root.scale, 0) + yOffset
+    property real xOffset: 0
+    property real yOffset: 0
+    property int widgetMonitorId: 0
+    
+    property var targetWindowWidth: (windowData?.size[0] ?? 100) * scale
+    property var targetWindowHeight: (windowData?.size[1] ?? 100) * scale
+    property bool hovered: false
+    property bool pressed: false
+
+    property var iconToWindowRatio: 0.25
+    property var xwaylandIndicatorToIconRatio: 0.35
+    property var iconToWindowRatioCompact: 0.45
+    property var entry: DesktopEntries.heuristicLookup(windowData?.class)
+    property var iconPath: Quickshell.iconPath(entry?.icon ?? windowData?.class ?? "application-x-executable", "image-missing")
+    property bool compactMode: Appearance.font.pixelSize.smaller * 4 > targetWindowHeight || Appearance.font.pixelSize.smaller * 4 > targetWindowWidth
+
+    property bool indicateXWayland: windowData?.xwayland ?? false
+    
+    x: initX
+    y: initY
+    width: Math.min((windowData?.size[0] ?? 100) * root.scale, availableWorkspaceWidth)
+    height: Math.min((windowData?.size[1] ?? 100) * root.scale, availableWorkspaceHeight)
+    opacity: (windowData?.monitor ?? -1) == widgetMonitorId ? 1 : 0.4
+
+    layer.enabled: true
+    layer.smooth: true
+    layer.mipmap: true
+
+    Behavior on x {
+        animation: Appearance.animation.elementMoveEnter.numberAnimation.createObject(this)
+    }
+    Behavior on y {
+        animation: Appearance.animation.elementMoveEnter.numberAnimation.createObject(this)
+    }
+    Behavior on width {
+        animation: Appearance.animation.elementMoveEnter.numberAnimation.createObject(this)
+    }
+    Behavior on height {
+        animation: Appearance.animation.elementMoveEnter.numberAnimation.createObject(this)
+    }
+
+    Rectangle {
+        id: clipContainer
+        anchors.fill: parent
+        radius: Appearance.rounding.windowRounding * root.scale
+        clip: true
+        color: "transparent"
+
+        ScreencopyView {
+            id: windowPreview
+            anchors.fill: parent
+            captureSource: GlobalStates.overviewOpen ? root.toplevel : null
+            live: true
+
+            Rectangle {
+                anchors.fill: parent
+                radius: Appearance.rounding.windowRounding * root.scale
+                color: pressed ? ColorUtils.transparentize(Appearance.colors.colLayer2Active, 0.5) : 
+                    hovered ? ColorUtils.transparentize(Appearance.colors.colLayer2Hover, 0.7) : 
+                    ColorUtils.transparentize(Appearance.colors.colLayer2)
+                border.color : ColorUtils.transparentize(Appearance.m3colors.m3outline, 0.7)
+                border.width : 1
+            }
+
+        ColumnLayout {
+            anchors.verticalCenter: parent.verticalCenter
+            anchors.left: parent.left
+            anchors.right: parent.right
+            spacing: Appearance.font.pixelSize.smaller * 0.5
+
+            Image {
+                id: windowIcon
+                property var iconSize: {
+                    return Math.min(targetWindowWidth, targetWindowHeight) * (root.compactMode ? root.iconToWindowRatioCompact : root.iconToWindowRatio) / (root.monitorData?.scale ?? 1);
+                }
+                Layout.alignment: Qt.AlignHCenter
+                source: root.iconPath
+                width: iconSize
+                height: iconSize
+                sourceSize: Qt.size(iconSize, iconSize)
+
+                Behavior on width {
+                    animation: Appearance.animation.elementMoveEnter.numberAnimation.createObject(this)
+                }
+                Behavior on height {
+                    animation: Appearance.animation.elementMoveEnter.numberAnimation.createObject(this)
+                }
+            }
+        }
+    }
+    }
+}
diff --git a/config/quickshell/overview-bak/modules/overview/qmldir b/config/quickshell/overview-bak/modules/overview/qmldir
new file mode 100644
index 00000000..9b15b45b
--- /dev/null
+++ b/config/quickshell/overview-bak/modules/overview/qmldir
@@ -0,0 +1,3 @@
+Overview 1.0 Overview.qml
+OverviewWidget 1.0 OverviewWidget.qml
+OverviewWindow 1.0 OverviewWindow.qml
diff --git a/config/quickshell/overview-bak/services/GlobalStates.qml b/config/quickshell/overview-bak/services/GlobalStates.qml
new file mode 100644
index 00000000..7644e385
--- /dev/null
+++ b/config/quickshell/overview-bak/services/GlobalStates.qml
@@ -0,0 +1,11 @@
+pragma Singleton
+pragma ComponentBehavior: Bound
+
+import QtQuick
+import Quickshell
+
+Singleton {
+    id: root
+    property bool overviewOpen: false
+    property bool superReleaseMightTrigger: true
+}
diff --git a/config/quickshell/overview-bak/services/HyprlandData.qml b/config/quickshell/overview-bak/services/HyprlandData.qml
new file mode 100644
index 00000000..e23472d0
--- /dev/null
+++ b/config/quickshell/overview-bak/services/HyprlandData.qml
@@ -0,0 +1,137 @@
+pragma Singleton
+pragma ComponentBehavior: Bound
+
+import QtQuick
+import Quickshell
+import Quickshell.Io
+import Quickshell.Hyprland
+
+/**
+ * Provides access to some Hyprland data not available in Quickshell.Hyprland.
+ */
+Singleton {
+    id: root
+    property var windowList: []
+    property var addresses: []
+    property var windowByAddress: ({})
+    property var workspaces: []
+    property var workspaceIds: []
+    property var workspaceById: ({})
+    property var activeWorkspace: null
+    property var monitors: []
+    property var layers: ({})
+
+    function updateWindowList() {
+        getClients.running = true;
+    }
+
+    function updateLayers() {
+        getLayers.running = true;
+    }
+
+    function updateMonitors() {
+        getMonitors.running = true;
+    }
+
+    function updateWorkspaces() {
+        getWorkspaces.running = true;
+        getActiveWorkspace.running = true;
+    }
+
+    function updateAll() {
+        updateWindowList();
+        updateMonitors();
+        updateLayers();
+        updateWorkspaces();
+    }
+
+    function biggestWindowForWorkspace(workspaceId) {
+        const windowsInThisWorkspace = HyprlandData.windowList.filter(w => w.workspace.id == workspaceId);
+        return windowsInThisWorkspace.reduce((maxWin, win) => {
+            const maxArea = (maxWin?.size?.[0] ?? 0) * (maxWin?.size?.[1] ?? 0);
+            const winArea = (win?.size?.[0] ?? 0) * (win?.size?.[1] ?? 0);
+            return winArea > maxArea ? win : maxWin;
+        }, null);
+    }
+
+    Component.onCompleted: {
+        updateAll();
+    }
+
+    Connections {
+        target: Hyprland
+
+        function onRawEvent(event) {
+            updateAll()
+        }
+    }
+
+    Process {
+        id: getClients
+        command: ["hyprctl", "clients", "-j"]
+        stdout: StdioCollector {
+            id: clientsCollector
+            onStreamFinished: {
+                root.windowList = JSON.parse(clientsCollector.text)
+                let tempWinByAddress = {};
+                for (var i = 0; i < root.windowList.length; ++i) {
+                    var win = root.windowList[i];
+                    tempWinByAddress[win.address] = win;
+                }
+                root.windowByAddress = tempWinByAddress;
+                root.addresses = root.windowList.map(win => win.address);
+            }
+        }
+    }
+
+    Process {
+        id: getMonitors
+        command: ["hyprctl", "monitors", "-j"]
+        stdout: StdioCollector {
+            id: monitorsCollector
+            onStreamFinished: {
+                root.monitors = JSON.parse(monitorsCollector.text);
+            }
+        }
+    }
+
+    Process {
+        id: getLayers
+        command: ["hyprctl", "layers", "-j"]
+        stdout: StdioCollector {
+            id: layersCollector
+            onStreamFinished: {
+                root.layers = JSON.parse(layersCollector.text);
+            }
+        }
+    }
+
+    Process {
+        id: getWorkspaces
+        command: ["hyprctl", "workspaces", "-j"]
+        stdout: StdioCollector {
+            id: workspacesCollector
+            onStreamFinished: {
+                root.workspaces = JSON.parse(workspacesCollector.text);
+                let tempWorkspaceById = {};
+                for (var i = 0; i < root.workspaces.length; ++i) {
+                    var ws = root.workspaces[i];
+                    tempWorkspaceById[ws.id] = ws;
+                }
+                root.workspaceById = tempWorkspaceById;
+                root.workspaceIds = root.workspaces.map(ws => ws.id);
+            }
+        }
+    }
+
+    Process {
+        id: getActiveWorkspace
+        command: ["hyprctl", "activeworkspace", "-j"]
+        stdout: StdioCollector {
+            id: activeWorkspaceCollector
+            onStreamFinished: {
+                root.activeWorkspace = JSON.parse(activeWorkspaceCollector.text);
+            }
+        }
+    }
+}
diff --git a/config/quickshell/overview-bak/services/qmldir b/config/quickshell/overview-bak/services/qmldir
new file mode 100644
index 00000000..b9008641
--- /dev/null
+++ b/config/quickshell/overview-bak/services/qmldir
@@ -0,0 +1,2 @@
+singleton HyprlandData 1.0 HyprlandData.qml
+singleton GlobalStates 1.0 GlobalStates.qml
diff --git a/config/quickshell/overview-bak/shell.qml b/config/quickshell/overview-bak/shell.qml
new file mode 100644
index 00000000..e92b4eb7
--- /dev/null
+++ b/config/quickshell/overview-bak/shell.qml
@@ -0,0 +1,16 @@
+//@ pragma UseQApplication
+//@ pragma Env QT_QUICK_CONTROLS_STYLE=Basic
+
+import "./modules/overview/"
+import "./services/"
+import "./common/"
+import "./common/functions/"
+import "./common/widgets/"
+
+import QtQuick
+import Quickshell
+import Quickshell.Hyprland
+
+ShellRoot {
+    Overview {}
+}
diff --git a/config/quickshell/overview/.github/FUNDING.yml b/config/quickshell/overview/.github/FUNDING.yml
new file mode 100644
index 00000000..22652281
--- /dev/null
+++ b/config/quickshell/overview/.github/FUNDING.yml
@@ -0,0 +1 @@
+github: Shanu-Kumawat
diff --git a/config/quickshell/overview/README.md b/config/quickshell/overview/README.md
index c32e7ac5..64dd8b68 100644
--- a/config/quickshell/overview/README.md
+++ b/config/quickshell/overview/README.md
@@ -9,6 +9,7 @@ A standalone workspace overview module for Hyprland using Quickshell - shows all
 ![Qt6](https://img.shields.io/badge/Qt-6-green?style=flat-square)
 ![License](https://img.shields.io/badge/License-GPL-orange?style=flat-square)
 
+
 </div>
 
 ---
@@ -17,7 +18,7 @@ A standalone workspace overview module for Hyprland using Quickshell - shows all
 
 ![Overview Screenshot](assets/image.png)
 
-https://github.com/user-attachments/assets/79ceb141-6b9e-4956-8e09-aaf72b66550c
+https://github.com/user-attachments/assets/e8f392d7-d831-4dec-9cd3-fb93d1ccc21c
 
 > *Workspace overview showing live window previews with drag-and-drop support*
 
@@ -26,40 +27,85 @@ https://github.com/user-attachments/assets/79ceb141-6b9e-4956-8e09-aaf72b66550c
 ## ✨ Features
 
 - 🖼️ Visual workspace overview showing all workspaces and windows
+- 🖥️ Multi-monitor support with proper scaling and vertical/rotated monitors [in experimental branch]
+- 📐 Smart row hiding - optionally hide empty workspace rows
 - 🎯 Click windows to focus them
 - 🖱️ Middle-click windows to close them  
 - 🔄 Drag and drop windows between workspaces
-- ⌨️ Keyboard navigation (Arrow keys to switch workspaces, Escape/Enter to close)
+- ⌨️ Keyboard navigation (Arrow keys, vim keys, number shortcuts)
+- 🖱️ Auto-close on focus loss / outside click
 - 💡 Hover tooltips showing window information
 - 🎨 Material Design 3 theming
 - ⚡ Smooth animations and transitions
 
 ## 📦 Installation
 
+### Arch Linux (AUR)
+
+For Arch Linux users, you can install directly from the AUR:
+
+```bash
+# Using yay
+yay -S quickshell-overview-git
+
+# Using paru
+paru -S quickshell-overview-git
+```
+
+On AUR installs, module files are package-managed under:
+
+```text
+/etc/xdg/quickshell/overview/
+```
+
+Put your custom settings in:
+
+```text
+~/.config/quickshell/overview/config.json
+```
+
+Then add the keybind and auto-start to your Hyprland config (see Setup steps 2-4 below).
+
 ### Prerequisites
 
 - **Hyprland** compositor
 - **Quickshell** ([installation guide](https://quickshell.org/docs/v0.1.0/guide/install-setup/))
-- **Qt 6** with modules: QtQuick, QtQuick.Controls, Qt5Compat.GraphicalEffects
+- **Qt 6** with modules: QtQuick, QtQuick.Controls
 
 ### Setup
 
-1. **Clone this repository** to your Quickshell config directory:
+1. **Install module files** (choose one):
+   - **Git clone (manual install):**
    ```bash
    git clone https://github.com/Shanu-Kumawat/quickshell-overview ~/.config/quickshell/overview
    ```
+   - **AUR package:** use the command above (`yay -S quickshell-overview-git` or `paru -S ...`)
 
-2. **Add keybind** to your Hyprland config (`~/.config/hypr/hyprland.conf`):
+2. **Add keybind** to your Hyprland config:
+
+   *For Hyprland 0.55+ (`~/.config/hypr/hyprland.lua`):*
+   ```lua
+   hl.bind("SUPER + TAB", hl.dsp.exec_cmd("qs ipc -c overview call overview toggle"))
+   ```
+   *For Hyprland 0.54 and older (`~/.config/hypr/hyprland.conf`):*
    ```conf
    bind = Super, TAB, exec, qs ipc -c overview call overview toggle
    ```
 
-3. **Auto-start** the overview (add to Hyprland config):
+4. **Auto-start** the overview (add to Hyprland config):
+
+   *For Hyprland 0.55+ (`~/.config/hypr/hyprland.lua`):*
+   ```lua
+   hl.on("hyprland.start", function () 
+       hl.exec_cmd("qs -c overview")
+   end)
+   ```
+   *For Hyprland 0.54 and older (`~/.config/hypr/hyprland.conf`):*
    ```conf
    exec-once = qs -c overview
    ```
 
-4. **Reload Hyprland**:
+6. **Reload Hyprland**:
    ```bash
    hyprctl reload
    ```
@@ -70,36 +116,116 @@ https://github.com/user-attachments/assets/79ceb141-6b9e-4956-8e09-aaf72b66550c
 qs -c overview &
 ```
 
+### NixOS
+
+For NixOS users, ensure Quickshell has access to required Qt6 modules:
+
+```nix
+# In your configuration.nix or home-manager config
+environment.systemPackages = with pkgs; [
+  quickshell
+  qt6.qtwayland
+];
+```
+
+If you're using home-manager:
+
+```nix
+home.packages = with pkgs; [
+  quickshell
+  qt6.qtwayland
+];
+```
+
 ## 🎮 Usage
 
 | Action | Description |
 |--------|-------------|
 | **Super + Tab** | Toggle the overview |
-| **Left/Right Arrow Keys** | Navigate between workspaces horizontally |
-| **Up/Down Arrow Keys** | Navigate between workspace rows |
+| **Arrow Keys / h/l** | Navigate left/right within current row* |
+| **Up/Down / j/k** | Navigate between workspace rows |
+| **1-9, 0** | Jump to Nth workspace in current group (0 = 10th) |
+| **Mouse wheel on grid** | Move across all normal workspaces, wrapping from last to first |
 | **Escape / Enter** | Close the overview |
+| **Click outside overview** | Close the overview when `overview.closeOnFocusLoss` is enabled (default) |
 | **Click workspace** | Switch to that workspace |
 | **Click window** | Focus that window |
 | **Middle-click window** | Close that window |
 | **Drag window** | Move window to different workspace |
 
+> *When `hideEmptyRows` is enabled, left/right navigation wraps within the current visible row for better UX
+
 ---
 
 ## ⚙️ Configuration
 
-> **⚠️ Want to change the size, position, or number of workspaces?**  
-> Edit `~/.config/quickshell/overview/common/Config.qml` - it's all there!
+> **⚠️ Want to change size, position, workspace count, or toggles?**
+> Create/edit `~/.config/quickshell/overview/config.json`.
+
+`Config.qml` inside the module is now treated as defaults. User overrides are read from:
+
+- `$XDG_CONFIG_HOME/quickshell/overview/config.json`
+- fallback: `~/.config/quickshell/overview/config.json`
+
+> **Note:** After editing `config.json`, manually restart overview for changes to apply:
+> `qs ipc -c overview call overview close && qs -c overview`
+
+### Quick Start
+
+```bash
+mkdir -p ~/.config/quickshell/overview
+cp /etc/xdg/quickshell/overview/config.example.json ~/.config/quickshell/overview/config.json
+```
+
+If you installed from git clone instead of AUR, copy from your repo path:
+
+```bash
+cp ~/.config/quickshell/overview/config.example.json ~/.config/quickshell/overview/config.json
+```
 
 ### Workspace Grid
 
-Edit `~/.config/quickshell/overview/common/Config.qml`:
+Edit `~/.config/quickshell/overview/config.json`:
 
-```qml
-property QtObject overview: QtObject {
-    property int rows: 2        // Number of workspace rows
-    property int columns: 5     // Number of workspace columns (10 total workspaces)
-    property real scale: 0.16   // Overview scale factor (0.1-0.3, smaller = more compact)
-    property bool enable: true
+```json
+{
+  "overview": {
+    "rows": 2,
+    "columns": 5,
+    "scale": 0.16,
+    "enable": true,
+    "hideEmptyRows": true,
+    "closeOnFocusLoss": true,
+    "useWorkspaceMap": false,
+    "workspaceMap": [0, 10],
+    "orderRightLeft": false,
+    "orderBottomUp": false,
+    "previewsEnabled": true,
+    "previewMode": "live",
+    "includeInactiveMonitorPreviews": true,
+    "previewRecaptureDelayMs": 60,
+    "showSpecialWorkspaces": true,
+    "specialWorkspaces": [],
+    "specialWorkspaceColumns": 5,
+    "emptyWorkspaceWallpaper": "",
+    "specialEmptyWorkspaceWallpaper": "",
+    "effects": {
+      "enableBackdrop": false,
+      "backdropOpacity": 0.28,
+      "panelOpacity": 0.92,
+      "workspaceOpacity": 0.86,
+      "emptyWorkspaceWallpaperOverlayOpacity": 0.18,
+      "windowOverlayOpacity": 0.22,
+      "enableBlur": false,
+      "glassMode": false,
+      "glassTintStrength": 0.35,
+      "glassBorderOpacity": 0.72,
+      "glassShineOpacity": 0.14
+    },
+    "workspaceSpacing": 5,
+    "backgroundPadding": 10,
+    "workspaceNumberBaseSize": 250
+  }
 }
 ```
 
@@ -107,26 +233,382 @@ property QtObject overview: QtObject {
 - **Too small?** Increase `scale` (try 0.20 or 0.25)
 - **Too big?** Decrease `scale` (try 0.12 or 0.14)
 - **More workspaces?** Change `rows` and `columns` (e.g., 3 rows × 4 columns = 12 workspaces)
+- **Reverse order?** Set `orderRightLeft` and/or `orderBottomUp` to `true`
+- **Prefer the overview to stay open after outside clicks/focus changes?** Set `closeOnFocusLoss` to `false`
+- **Per-monitor workspace groups?** Enable `useWorkspaceMap` and set `workspaceMap` (e.g. `[0,10]`)
+- **Show special workspaces below grid?** Keep `showSpecialWorkspaces: true` and optionally prefill `specialWorkspaces`
+- **Lower memory use?** Set `previewMode` to `event` and `includeInactiveMonitorPreviews` to `false`
+- **Transparency / blur?** Tune `overview.effects.*` (details below)
+
+**Hide empty workspace rows:**
+- Set `hideEmptyRows: true` to automatically hide rows that have no windows
+- Keeps your overview clean by only showing rows with active workspaces
+- The current workspace row is always visible, even if empty
+- Arrow key navigation (left/right) stays within the current row when enabled
+- Great for 2-row setups where you rarely use workspaces 6-10
+
+**Close on focus loss / outside click:**
+- `closeOnFocusLoss` defaults to `true`
+- When enabled, clicking outside the overview closes it, similar to menus, dropdowns, and launchers
+- The overview also closes when its Hyprland focus grab is cleared
+- Set `closeOnFocusLoss: false` if you want the previous behavior where the overview can remain open after focus changes
 
 ### Position
 
-Edit `~/.config/quickshell/overview/modules/overview/Overview.qml` (line ~111):
+Edit `~/.config/quickshell/overview/config.json`:
+
+```json
+{
+  "position": {
+    "topMargin": 100
+  }
+}
+```
+
+Increase `topMargin` to move the overview down. Decrease it to move up.
+
+### Window Preview
+
+```json
+{
+  "windowPreview": {
+    "showIcons": true,
+    "iconToWindowRatio": 0.25,
+    "iconToWindowRatioCompact": 0.45,
+    "xwaylandIndicatorToIconRatio": 0.35,
+    "inactiveMonitorOpacity": 0.4,
+    "cropToFill": false
+  }
+}
+```
+
+- `cropToFill`: crop full-screen windows to fill the workspace preview when `true`; keep the full window in preview with possible horizontal/vertical "padding" bars when `false`
+
+### Performance Tuning
+
+```json
+{
+  "overview": {
+    "previewsEnabled": true,
+    "previewMode": "live",
+    "includeInactiveMonitorPreviews": true,
+    "previewRecaptureDelayMs": 60
+  },
+  "hacks": {
+    "hyprlandEventDebounceMs": 40
+  }
+}
+```
+
+- `overview.previewsEnabled`: turn all window screencopy previews on/off
+- `overview.previewMode`: `live` (best visuals, more RAM) or `event` (lower RAM, refreshes on window events)
+- `overview.includeInactiveMonitorPreviews`: when `false`, only current monitor windows get preview capture
+- `overview.previewRecaptureDelayMs`: delay used for event-mode snapshot refresh (lower = faster updates)
+- `hacks.hyprlandEventDebounceMs`: coalesces Hyprland event refreshes to reduce command churn
+
+### Special Workspaces
+
+```json
+{
+  "overview": {
+    "showSpecialWorkspaces": true,
+    "specialWorkspaces": ["stash", "music", "scratch"],
+    "specialWorkspaceColumns": 5
+  }
+}
+```
+
+- `showSpecialWorkspaces`: renders special workspaces in a strip under the normal grid
+- `specialWorkspaces`: optional preconfigured special workspace names (without the `special:` prefix)
+- `specialWorkspaceColumns`: how many special tiles per row before wrapping
+- `emptyWorkspaceWallpaper`: optional image path used as the background for normal workspace tiles
+- `specialEmptyWorkspaceWallpaper`: optional image path used as the background for special workspace tiles
+
+Interaction behavior:
+- Preconfigured special workspaces appear in the overview even when they are empty
+- The special strip shows active special workspaces plus any names you preconfigure
+- This is useful for fixed workflows like `stash`, `music`, or `scratch`
+- Click a special tile to run `togglespecialworkspace <name>`
+- Click the `+` tile to create and open a new special workspace
+- Drag a window onto a special tile to move it with `movetoworkspacesilent special:<name>`
+- Drag a window onto the `+` tile to auto-create a new special workspace (`stash`, `stash-2`, ...), even when no special workspace is currently open or preconfigured
+- Special windows are visible directly in those tiles
+- Restart Quickshell after changing `config.json`, otherwise the special workspace list will not refresh immediately
+
+Normal workspace scrolling:
+- Scroll on the normal workspace grid to move the active workspace/highlighter across all normal workspaces
+- Scrolling wraps from the last workspace back to `1`, and from `1` back to the last
+
+### Workspace Wallpaper
+
+```json
+{
+  "overview": {
+    "emptyWorkspaceWallpaper": "/home/your-user/Pictures/wallpaper.png",
+    "specialEmptyWorkspaceWallpaper": "/home/your-user/Pictures/special-wallpaper.png",
+    "effects": {
+      "emptyWorkspaceWallpaperOverlayOpacity": 0.12
+    }
+  }
+}
+```
+
+- Normal workspaces can use a wallpaper as their background
+- Special workspaces can use a different wallpaper as their background
+- The wallpaper remains visible behind floating or partially covered windows
+- If no special workspaces exist yet, that special wallpaper is also used for the `+` create tile
+- `emptyWorkspaceWallpaperOverlayOpacity` controls how much tint is applied over that wallpaper
+- Use an absolute path for the image for the most reliable behavior
+- Restart Quickshell after changing `config.json`, otherwise the wallpaper path will not refresh immediately
+
+Demo:
+
+![Workspace wallpaper demo](assets/Workspace_Wallpaper.png)
+
+### Transparency & Blur
+
+```json
+{
+  "overview": {
+    "effects": {
+      "enableBackdrop": false,
+      "backdropOpacity": 0.28,
+      "panelOpacity": 0.92,
+      "workspaceOpacity": 0.86,
+      "emptyWorkspaceWallpaperOverlayOpacity": 0.18,
+      "windowOverlayOpacity": 0.22,
+      "enableBlur": false,
+      "glassMode": false,
+      "glassTintStrength": 0.35,
+      "glassBorderOpacity": 0.72,
+      "glassShineOpacity": 0.14
+    }
+  }
+}
+```
+
+- `enableBackdrop`: show/hide full-screen dim backdrop behind overview
+- `backdropOpacity`: opacity of backdrop dim layer (`0` to `1`)
+- `panelOpacity`: opacity of overview panel container (`0` to `1`)
+- `workspaceOpacity`: opacity of each workspace tile (`0` to `1`)
+- `emptyWorkspaceWallpaperOverlayOpacity`: tint strength over empty-workspace wallpaper (`0` to `1`)
+- `windowOverlayOpacity`: opacity of the color tint over window previews (`0` to `1`)
+- `enableBlur`: switches layer namespace to `quickshell:overview-blur`
+- `glassMode`: enables a glass-like tint + softer transparency preset for panel/workspaces/windows
+- `glassTintStrength`: tint mixing strength for glass mode (`0` to `1`)
+- `glassBorderOpacity`: border alpha used by glass mode (`0` to `1`)
+- `glassShineOpacity`: top highlight strength for glass reflections (`0` to `1`)
+
+Stronger glass preset:
+
+```json
+{
+  "overview": {
+    "effects": {
+      "enableBackdrop": true,
+      "enableBlur": true,
+      "panelOpacity": 0.55,
+      "workspaceOpacity": 0.48,
+      "emptyWorkspaceWallpaperOverlayOpacity": 0.10,
+      "windowOverlayOpacity": 0.08,
+      "glassMode": true,
+      "glassTintStrength": 0.55,
+      "glassBorderOpacity": 0.85,
+      "glassShineOpacity": 0.32
+    }
+  }
+}
+```
 
-```qml
-anchors {
-    horizontalCenter: parent.horizontalCenter
-    top: parent.top
-    topMargin: 100  // Change this value to move up/down
+For Hyprland blur, add layer rules (example):
+
+```ini
+layerrule = blur true, match:namespace quickshell:overview-blur
+layerrule = ignore_alpha 0.2, match:namespace quickshell:overview-blur
+```
+
+If `enableBlur` is `false`, namespace remains `quickshell:overview`.
+
+Low-memory preset:
+
+```json
+{
+  "overview": {
+    "previewMode": "event",
+    "includeInactiveMonitorPreviews": false
+  },
+  "hacks": {
+    "hyprlandEventDebounceMs": 80
+  }
+}
+```
+
+### Full Example
+
+```json
+{
+  "appearance": {
+    "colorSource": "default",
+    "caelestia": {
+      "autoRefresh": true,
+      "refreshInterval": 2000,
+      "accentProfile": "vibrant"
+    },
+    "rounding": {
+      "unsharpen": 2,
+      "verysmall": 8,
+      "small": 12,
+      "normal": 17,
+      "large": 23,
+      "full": 9999,
+      "screenRounding": 23,
+      "windowRounding": 18
+    },
+    "font": {
+      "family": {
+        "main": "sans-serif",
+        "title": "sans-serif",
+        "expressive": "sans-serif"
+      },
+      "pixelSize": {
+        "smaller": 12,
+        "small": 15,
+        "normal": 16,
+        "larger": 19,
+        "huge": 22
+      }
+    },
+    "animation": {
+      "duration": {
+        "elementMove": 500,
+        "elementMoveEnter": 400,
+        "elementMoveFast": 200
+      }
+    },
+    "sizes": {
+      "elevationMargin": 10
+    }
+  },
+  "overview": {
+    "rows": 2,
+    "columns": 5,
+    "scale": 0.16,
+    "enable": true,
+    "hideEmptyRows": true,
+    "closeOnFocusLoss": true,
+    "useWorkspaceMap": false,
+    "workspaceMap": [0, 10],
+    "orderRightLeft": false,
+    "orderBottomUp": false,
+    "previewsEnabled": true,
+    "previewMode": "live",
+    "includeInactiveMonitorPreviews": true,
+    "previewRecaptureDelayMs": 60,
+    "showSpecialWorkspaces": true,
+    "specialWorkspaces": [],
+    "specialWorkspaceColumns": 5,
+    "emptyWorkspaceWallpaper": "",
+    "specialEmptyWorkspaceWallpaper": "",
+    "effects": {
+      "enableBackdrop": false,
+      "backdropOpacity": 0.28,
+      "panelOpacity": 0.92,
+      "workspaceOpacity": 0.86,
+      "emptyWorkspaceWallpaperOverlayOpacity": 0.18,
+      "windowOverlayOpacity": 0.22,
+      "enableBlur": false,
+      "glassMode": false,
+      "glassTintStrength": 0.35,
+      "glassBorderOpacity": 0.72,
+      "glassShineOpacity": 0.14
+    },
+    "workspaceSpacing": 5,
+    "backgroundPadding": 10,
+    "workspaceNumberBaseSize": 250
+  },
+  "position": {
+    "topMargin": 100
+  },
+  "windowPreview": {
+    "showIcons": true,
+    "iconToWindowRatio": 0.25,
+    "iconToWindowRatioCompact": 0.45,
+    "xwaylandIndicatorToIconRatio": 0.35,
+    "inactiveMonitorOpacity": 0.4,
+    "cropToFill": false
+  },
+  "hacks": {
+    "arbitraryRaceConditionDelay": 150,
+    "hyprlandEventDebounceMs": 40
+  }
 }
 ```
 
 ### Theme & Colors
 
-Edit `~/.config/quickshell/overview/common/Appearance.qml` to customize:
-- Colors (m3colors and colors objects)
-- Font families and sizes  
-- Animation curves and durations
-- Border radius values
+Most theme sizing/timing options are now configurable via `config.json`:
+- `appearance.colorSource` (`default`, `matugen`, `caelestia`)
+- `appearance.caelestia.*` (`autoRefresh`, `refreshInterval`, `accentProfile`)
+- `appearance.rounding.*`
+- `appearance.font.*`
+- `appearance.animation.duration.*`
+- `appearance.sizes.elevationMargin`
+
+For full color palette customization, edit `~/.config/quickshell/overview/common/Appearance.qml`.
+
+### Matugen (Dynamic Colors from Wallpaper)
+
+[Matugen](https://github.com/InioX/matugen) lets you generate Material You colors from your wallpaper and apply them to the overview automatically.
+
+**1. Install matugen** - follow [matugen's install guide](https://github.com/InioX/matugen?tab=readme-ov-file#installation)
+
+**2. Copy the template** from this repo to matugen's templates folder:
+```bash
+mkdir -p ~/.config/matugen/templates
+cp ~/.config/quickshell/overview/quickshell-overview.qml ~/.config/matugen/templates/
+```
+
+**3. Add this to `~/.config/matugen/config.toml`** (create the file if it doesn't exist):
+```toml
+[templates.quickshell_overview]
+input_path  = "./templates/quickshell-overview.qml"
+output_path = "~/.config/quickshell/overview/common/Appearance.colors.qml"
+```
+
+**4. Enable it** in `~/.config/quickshell/overview/config.json`:
+```json
+{
+  "appearance": {
+    "colorSource": "matugen"
+  }
+}
+```
+
+**5. Run matugen** with your wallpaper to generate colors:
+```bash
+matugen image /path/to/your/wallpaper.jpg
+```
+
+This generates `Appearance.colors.qml` which the overview loads automatically. Re-run step 5 whenever you change your wallpaper.
+
+### Caelestia
+
+If you use Caelestia, set the source to `caelestia`:
+
+```json
+{
+  "appearance": {
+    "colorSource": "caelestia",
+    "caelestia": {
+      "autoRefresh": true,
+      "refreshInterval": 2000,
+      "accentProfile": "vibrant"
+    }
+  }
+}
+```
+
+Overview reads the active palette from `caelestia scheme get` and refreshes it live when `autoRefresh` is enabled, so wallpaper/scheme changes can apply without restarting overview.
 
 ---
 
@@ -138,7 +620,6 @@ Edit `~/.config/quickshell/overview/common/Appearance.qml` to customize:
   - QtQuick
   - QtQuick.Controls
   - QtQuick.Layouts
-  - Qt5Compat.GraphicalEffects
   - Quickshell.Wayland
   - Quickshell.Hyprland
 
@@ -158,10 +639,11 @@ The following features were removed to make it standalone:
 ~/.config/quickshell/overview/
 ├── shell.qml                      # Main entry point
 ├── README.md                      # This file
+├── config.example.json            # User override template
 ├── hyprland-config.conf          # Configuration reference
 ├── common/
 │   ├── Appearance.qml            # Theme and styling
-│   ├── Config.qml                # Configuration options
+│   ├── Config.qml                # Default config + user override loader
 │   ├── functions/
 │   │   └── ColorUtils.qml        # Color manipulation utilities
 │   └── widgets/
@@ -197,6 +679,12 @@ qs ipc -c overview call overview close
 - Window icons may fallback to generic icon if app class name doesn't match icon theme
 - Potential crashes during rapid window state changes due to Wayland screencopy buffer management
 
+## 💖 Support
+
+If this project helps your setup and you want to support continued maintenance, you can sponsor here:
+
+https://github.com/sponsors/Shanu-Kumawat
+
 ##  Credits
 
 Extracted from the overview feature in [illogical-impulse](https://github.com/end-4/dots-hyprland) by [end-4](https://github.com/end-4).
diff --git a/config/quickshell/overview/assets/Workspace_Wallpaper.png b/config/quickshell/overview/assets/Workspace_Wallpaper.png
new file mode 100644
index 00000000..8739046b
--- /dev/null
+++ b/config/quickshell/overview/assets/Workspace_Wallpaper.png
diff --git a/config/quickshell/overview/assets/image.png b/config/quickshell/overview/assets/image.png
index 91db17cb..41d94892 100644
--- a/config/quickshell/overview/assets/image.png
+++ b/config/quickshell/overview/assets/image.png
diff --git a/config/quickshell/overview/common/Appearance.qml b/config/quickshell/overview/common/Appearance.qml
index 79a30b44..f97a0dfa 100644
--- a/config/quickshell/overview/common/Appearance.qml
+++ b/config/quickshell/overview/common/Appearance.qml
@@ -3,19 +3,37 @@ pragma ComponentBehavior: Bound
 
 import QtQuick
 import Quickshell
+import Quickshell.Io
 import "functions"
+import "." as Common
 
 Singleton {
     id: root
-    property QtObject m3colors
+    property string colorSource: Common.Config.options.appearance.colorSource
+    property string caelestiaAccentProfile: Common.Config.options.appearance.caelestia.accentProfile
+    property string lastCaelestiaPayload: ""
+    property QtObject m3colors: {
+        if (colorSource === "matugen" && matugenLoader.item)
+            return matugenLoader.item;
+        if (colorSource === "caelestia" && caelestiaPaletteLoaded)
+            return caelestiaColors;
+        return defaultColors;
+    }
     property QtObject animation
     property QtObject animationCurves
     property QtObject colors
     property QtObject rounding
     property QtObject font
     property QtObject sizes
+    property bool caelestiaPaletteLoaded: false
+
+    Loader {
+        id: matugenLoader
+        active: root.colorSource === "matugen"
+        source: "Appearance.colors.qml"
+    }
 
-    m3colors: QtObject {
+    property QtObject defaultColors: QtObject {
         property bool darkmode: true
         property color m3primary: "#E5B6F2"
         property color m3onPrimary: "#452152"
@@ -42,6 +60,196 @@ Singleton {
         property color m3shadow: "#000000"
     }
 
+    property QtObject caelestiaColors: QtObject {
+        property bool darkmode: defaultColors.darkmode
+        property color m3primary: defaultColors.m3primary
+        property color m3onPrimary: defaultColors.m3onPrimary
+        property color m3primaryContainer: defaultColors.m3primaryContainer
+        property color m3onPrimaryContainer: defaultColors.m3onPrimaryContainer
+        property color m3secondary: defaultColors.m3secondary
+        property color m3onSecondary: defaultColors.m3onSecondary
+        property color m3secondaryContainer: defaultColors.m3secondaryContainer
+        property color m3onSecondaryContainer: defaultColors.m3onSecondaryContainer
+        property color m3background: defaultColors.m3background
+        property color m3onBackground: defaultColors.m3onBackground
+        property color m3surface: defaultColors.m3surface
+        property color m3surfaceContainerLow: defaultColors.m3surfaceContainerLow
+        property color m3surfaceContainer: defaultColors.m3surfaceContainer
+        property color m3surfaceContainerHigh: defaultColors.m3surfaceContainerHigh
+        property color m3surfaceContainerHighest: defaultColors.m3surfaceContainerHighest
+        property color m3onSurface: defaultColors.m3onSurface
+        property color m3surfaceVariant: defaultColors.m3surfaceVariant
+        property color m3onSurfaceVariant: defaultColors.m3onSurfaceVariant
+        property color m3inverseSurface: defaultColors.m3inverseSurface
+        property color m3inverseOnSurface: defaultColors.m3inverseOnSurface
+        property color m3outline: defaultColors.m3outline
+        property color m3outlineVariant: defaultColors.m3outlineVariant
+        property color m3shadow: defaultColors.m3shadow
+    }
+
+    function loadCaelestiaPalette() {
+        getCaelestiaScheme.running = true;
+    }
+
+    function relativeLuminance(color) {
+        const c = Qt.color(color);
+        function channel(v) {
+            return v <= 0.03928 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);
+        }
+        return (0.2126 * channel(c.r)) + (0.7152 * channel(c.g)) + (0.0722 * channel(c.b));
+    }
+
+    function bestOnColor(backgroundColor) {
+        return relativeLuminance(backgroundColor) > 0.5 ? "#121212" : "#f5f5f5";
+    }
+
+    function firstColor(palette, keys, fallback) {
+        for (const key of keys) {
+            if (palette[key])
+                return palette[key];
+        }
+        return fallback;
+    }
+
+    function applyCaelestiaPalette(palette, mode) {
+        if (caelestiaAccentProfile === "vibrant") {
+            const primary = firstColor(palette, ["blue", "klink", "term12", "primary"], defaultColors.m3primary);
+            const secondary = firstColor(palette, ["mauve", "lavender", "term13", "secondary"], defaultColors.m3secondary);
+            const tertiary = firstColor(palette, ["pink", "rosewater", "term11", "tertiary"], defaultColors.m3secondaryContainer);
+            const primaryContainer = firstColor(palette, ["sapphire", "klinkSelection", "primaryContainer"], defaultColors.m3primaryContainer);
+            const secondaryContainer = firstColor(palette, ["surface2", "secondaryContainer"], defaultColors.m3secondaryContainer);
+
+            caelestiaColors.m3primary = primary;
+            caelestiaColors.m3onPrimary = bestOnColor(primary);
+            caelestiaColors.m3primaryContainer = primaryContainer;
+            caelestiaColors.m3onPrimaryContainer = bestOnColor(primaryContainer);
+            caelestiaColors.m3secondary = secondary;
+            caelestiaColors.m3onSecondary = bestOnColor(secondary);
+            caelestiaColors.m3secondaryContainer = secondaryContainer;
+            caelestiaColors.m3onSecondaryContainer = bestOnColor(secondaryContainer);
+            // Preserve a stronger accent presence across UI mixes.
+            caelestiaColors.m3surfaceVariant = firstColor(palette, ["surface1", "surfaceVariant"], defaultColors.m3surfaceVariant);
+            caelestiaColors.m3outline = firstColor(palette, ["overlay2", "outline"], defaultColors.m3outline);
+            caelestiaColors.m3outlineVariant = firstColor(palette, ["overlay0", "outlineVariant"], defaultColors.m3outlineVariant);
+            if (tertiary)
+                caelestiaColors.m3secondaryContainer = ColorUtils.mix(secondaryContainer, tertiary, 0.7);
+        } else {
+            const map = {
+                "primary": "m3primary",
+                "onPrimary": "m3onPrimary",
+                "primaryContainer": "m3primaryContainer",
+                "onPrimaryContainer": "m3onPrimaryContainer",
+                "secondary": "m3secondary",
+                "onSecondary": "m3onSecondary",
+                "secondaryContainer": "m3secondaryContainer",
+                "onSecondaryContainer": "m3onSecondaryContainer",
+                "surfaceVariant": "m3surfaceVariant",
+                "outline": "m3outline",
+                "outlineVariant": "m3outlineVariant"
+            };
+            for (const key in map) {
+                if (palette[key])
+                    caelestiaColors[map[key]] = palette[key];
+            }
+        }
+
+        // Keep foundational tones from Material keys for readability.
+        const baseMap = {
+            "background": "m3background",
+            "onBackground": "m3onBackground",
+            "surface": "m3surface",
+            "surfaceContainerLow": "m3surfaceContainerLow",
+            "surfaceContainer": "m3surfaceContainer",
+            "surfaceContainerHigh": "m3surfaceContainerHigh",
+            "surfaceContainerHighest": "m3surfaceContainerHighest",
+            "onSurface": "m3onSurface",
+            "inverseSurface": "m3inverseSurface",
+            "inverseOnSurface": "m3inverseOnSurface",
+            "shadow": "m3shadow"
+        };
+        for (const key in baseMap) {
+            if (palette[key])
+                caelestiaColors[baseMap[key]] = palette[key];
+        }
+
+        if (palette["onSurfaceVariant"])
+            caelestiaColors.m3onSurfaceVariant = palette["onSurfaceVariant"];
+
+        if (mode === "light")
+            caelestiaColors.darkmode = false;
+        else if (mode === "dark")
+            caelestiaColors.darkmode = true;
+    }
+
+    Process {
+        id: getCaelestiaScheme
+        command: ["sh", "-lc", "caelestia scheme get 2>/dev/null || true"]
+        stdout: StdioCollector {
+            id: caelestiaCollector
+            onStreamFinished: {
+                const text = caelestiaCollector.text;
+                if (!text || !text.trim()) {
+                    root.caelestiaPaletteLoaded = false;
+                    return;
+                }
+
+                const ansiPattern = /\x1b\[[0-9;]*m/g;
+                const lines = text.split("\n");
+                let mode = "";
+                const palette = ({});
+
+                for (const rawLine of lines) {
+                    const line = rawLine.replace(ansiPattern, "").trim();
+
+                    if (line.startsWith("Mode:")) {
+                        mode = line.split(":")[1]?.trim()?.toLowerCase() ?? "";
+                        continue;
+                    }
+
+                    const match = line.match(/^([A-Za-z0-9_]+):\s*.*?([0-9a-fA-F]{6})$/);
+                    if (!match)
+                        continue;
+
+                    palette[match[1]] = `#${match[2]}`;
+                }
+
+                const normalized = JSON.stringify({ mode: mode, palette: palette, profile: caelestiaAccentProfile });
+                if (normalized === root.lastCaelestiaPayload)
+                    return;
+
+                root.lastCaelestiaPayload = normalized;
+                applyCaelestiaPalette(palette, mode);
+                root.caelestiaPaletteLoaded = Object.keys(palette).length > 0;
+            }
+        }
+    }
+
+    Timer {
+        id: caelestiaRefreshTimer
+        interval: Math.max(500, Common.Config.options.appearance.caelestia.refreshInterval)
+        running: root.colorSource === "caelestia" && Common.Config.options.appearance.caelestia.autoRefresh
+        repeat: true
+        triggeredOnStart: false
+        onTriggered: root.loadCaelestiaPalette()
+    }
+
+    onColorSourceChanged: {
+        if (colorSource === "caelestia")
+            loadCaelestiaPalette();
+    }
+
+    onCaelestiaAccentProfileChanged: {
+        if (colorSource === "caelestia") {
+            root.lastCaelestiaPayload = "";
+            loadCaelestiaPalette();
+        }
+    }
+
+    Component.onCompleted: {
+        if (colorSource === "caelestia")
+            loadCaelestiaPalette();
+    }
+
     colors: QtObject {
         property color colSubtext: m3colors.m3outline
         property color colLayer0: m3colors.m3background
@@ -68,28 +276,28 @@ Singleton {
     }
 
     rounding: QtObject {
-        property int unsharpen: 2
-        property int verysmall: 8
-        property int small: 12
-        property int normal: 17
-        property int large: 23
-        property int full: 9999
-        property int screenRounding: large
-        property int windowRounding: 18
+        property int unsharpen: Common.Config.options.appearance.rounding.unsharpen
+        property int verysmall: Common.Config.options.appearance.rounding.verysmall
+        property int small: Common.Config.options.appearance.rounding.small
+        property int normal: Common.Config.options.appearance.rounding.normal
+        property int large: Common.Config.options.appearance.rounding.large
+        property int full: Common.Config.options.appearance.rounding.full
+        property int screenRounding: Common.Config.options.appearance.rounding.screenRounding
+        property int windowRounding: Common.Config.options.appearance.rounding.windowRounding
     }
 
     font: QtObject {
         property QtObject family: QtObject {
-            property string main: "sans-serif"
-            property string title: "sans-serif"
-            property string expressive: "sans-serif"
+            property string main: Common.Config.options.appearance.font.family.main
+            property string title: Common.Config.options.appearance.font.family.title
+            property string expressive: Common.Config.options.appearance.font.family.expressive
         }
         property QtObject pixelSize: QtObject {
-            property int smaller: 12
-            property int small: 15
-            property int normal: 16
-            property int larger: 19
-            property int huge: 22
+            property int smaller: Common.Config.options.appearance.font.pixelSize.smaller
+            property int small: Common.Config.options.appearance.font.pixelSize.small
+            property int normal: Common.Config.options.appearance.font.pixelSize.normal
+            property int larger: Common.Config.options.appearance.font.pixelSize.larger
+            property int huge: Common.Config.options.appearance.font.pixelSize.huge
         }
     }
 
@@ -97,8 +305,8 @@ Singleton {
         readonly property list<real> expressiveDefaultSpatial: [0.38, 1.21, 0.22, 1.00, 1, 1]
         readonly property list<real> expressiveEffects: [0.34, 0.80, 0.34, 1.00, 1, 1]
         readonly property list<real> emphasizedDecel: [0.05, 0.7, 0.1, 1, 1, 1]
-        readonly property real expressiveDefaultSpatialDuration: 500
-        readonly property real expressiveEffectsDuration: 200
+        readonly property real expressiveDefaultSpatialDuration: Common.Config.options.appearance.animation.duration.elementMove
+        readonly property real expressiveEffectsDuration: Common.Config.options.appearance.animation.duration.elementMoveFast
     }
 
     animation: QtObject {
@@ -116,7 +324,7 @@ Singleton {
         }
 
         property QtObject elementMoveEnter: QtObject {
-            property int duration: 400
+            property int duration: Common.Config.options.appearance.animation.duration.elementMoveEnter
             property int type: Easing.BezierSpline
             property list<real> bezierCurve: animationCurves.emphasizedDecel
             property Component numberAnimation: Component {
@@ -143,6 +351,6 @@ Singleton {
     }
 
     sizes: QtObject {
-        property real elevationMargin: 10
+        property real elevationMargin: Common.Config.options.appearance.sizes.elevationMargin
     }
 }
diff --git a/config/quickshell/overview/common/Config.qml b/config/quickshell/overview/common/Config.qml
index 48601dd3..621b39db 100644
--- a/config/quickshell/overview/common/Config.qml
+++ b/config/quickshell/overview/common/Config.qml
@@ -3,20 +3,192 @@ pragma ComponentBehavior: Bound
 
 import QtQuick
 import Quickshell
+import Quickshell.Io
 
 Singleton {
     id: root
-    
+
+    property var userOptions: ({})
+
+    function read(path, fallback) {
+        const parts = path.split(".");
+        let current = userOptions;
+
+        for (const part of parts) {
+            if (current === null || current === undefined || typeof current !== "object" || !(part in current)) {
+                return fallback;
+            }
+            current = current[part];
+        }
+
+        return current === undefined || current === null ? fallback : current;
+    }
+
+    function readInt(path, fallback) {
+        const value = read(path, fallback);
+        const parsed = Number(value);
+        return Number.isInteger(parsed) ? parsed : fallback;
+    }
+
+    function readReal(path, fallback) {
+        const value = read(path, fallback);
+        const parsed = Number(value);
+        return Number.isFinite(parsed) ? parsed : fallback;
+    }
+
+    function readBool(path, fallback) {
+        const value = read(path, fallback);
+        return typeof value === "boolean" ? value : fallback;
+    }
+
+    function readString(path, fallback) {
+        const value = read(path, fallback);
+        if (typeof value !== "string")
+            return fallback;
+
+        const trimmed = value.trim();
+        return trimmed.length > 0 ? trimmed : fallback;
+    }
+
     property QtObject options: QtObject {
+        property QtObject appearance: QtObject {
+            property string colorSource: root.readString(
+                "appearance.colorSource",
+                root.readBool("appearance.useMatugenColors", false) ? "matugen" : "default"
+            )
+            property bool useMatugenColors: colorSource === "matugen"
+            property QtObject caelestia: QtObject {
+                property bool autoRefresh: root.readBool("appearance.caelestia.autoRefresh", true)
+                property int refreshInterval: root.readInt("appearance.caelestia.refreshInterval", 2000)
+                property string accentProfile: root.readString("appearance.caelestia.accentProfile", "vibrant")
+            }
+
+            property QtObject rounding: QtObject {
+                property int unsharpen: root.readInt("appearance.rounding.unsharpen", 2)
+                property int verysmall: root.readInt("appearance.rounding.verysmall", 8)
+                property int small: root.readInt("appearance.rounding.small", 12)
+                property int normal: root.readInt("appearance.rounding.normal", 17)
+                property int large: root.readInt("appearance.rounding.large", 23)
+                property int full: root.readInt("appearance.rounding.full", 9999)
+                property int screenRounding: root.readInt("appearance.rounding.screenRounding", large)
+                property int windowRounding: root.readInt("appearance.rounding.windowRounding", 18)
+            }
+
+            property QtObject font: QtObject {
+                property QtObject family: QtObject {
+                    property string main: root.readString("appearance.font.family.main", "sans-serif")
+                    property string title: root.readString("appearance.font.family.title", "sans-serif")
+                    property string expressive: root.readString("appearance.font.family.expressive", "sans-serif")
+                }
+
+                property QtObject pixelSize: QtObject {
+                    property int smaller: root.readInt("appearance.font.pixelSize.smaller", 12)
+                    property int small: root.readInt("appearance.font.pixelSize.small", 15)
+                    property int normal: root.readInt("appearance.font.pixelSize.normal", 16)
+                    property int larger: root.readInt("appearance.font.pixelSize.larger", 19)
+                    property int huge: root.readInt("appearance.font.pixelSize.huge", 22)
+                }
+            }
+
+            property QtObject animation: QtObject {
+                property QtObject duration: QtObject {
+                    property int elementMove: root.readInt("appearance.animation.duration.elementMove", 500)
+                    property int elementMoveEnter: root.readInt("appearance.animation.duration.elementMoveEnter", 400)
+                    property int elementMoveFast: root.readInt("appearance.animation.duration.elementMoveFast", 200)
+                }
+            }
+
+            property QtObject sizes: QtObject {
+                property real elevationMargin: root.readReal("appearance.sizes.elevationMargin", 10)
+            }
+        }
+
         property QtObject overview: QtObject {
-            property int rows: 2
-            property int columns: 5
-            property real scale: 0.16
-            property bool enable: true
+            property int rows: root.readInt("overview.rows", 2)
+            property int columns: root.readInt("overview.columns", 5)
+            property real scale: root.readReal("overview.scale", 0.16)
+            property bool enable: root.readBool("overview.enable", true)
+            property bool hideEmptyRows: root.readBool("overview.hideEmptyRows", true)
+            property bool closeOnFocusLoss: root.readBool("overview.closeOnFocusLoss", true)
+            property bool useWorkspaceMap: root.readBool("overview.useWorkspaceMap", false)
+            property var workspaceMap: root.read("overview.workspaceMap", [])
+            property bool orderRightLeft: root.readBool("overview.orderRightLeft", false)
+            property bool orderBottomUp: root.readBool("overview.orderBottomUp", false)
+            property bool previewsEnabled: root.readBool("overview.previewsEnabled", true)
+            property string previewMode: root.readString("overview.previewMode", "live")
+            property bool includeInactiveMonitorPreviews: root.readBool("overview.includeInactiveMonitorPreviews", true)
+            property int previewRecaptureDelayMs: root.readInt("overview.previewRecaptureDelayMs", 60)
+            property bool showSpecialWorkspaces: root.readBool("overview.showSpecialWorkspaces", true)
+            property var specialWorkspaces: root.read("overview.specialWorkspaces", [])
+            property int specialWorkspaceColumns: root.readInt("overview.specialWorkspaceColumns", columns)
+            property string emptyWorkspaceWallpaper: root.readString("overview.emptyWorkspaceWallpaper", "")
+            property string specialEmptyWorkspaceWallpaper: root.readString("overview.specialEmptyWorkspaceWallpaper", "")
+            property real workspaceSpacing: root.readReal("overview.workspaceSpacing", 5)
+            property real backgroundPadding: root.readReal("overview.backgroundPadding", 10)
+            property real workspaceNumberBaseSize: root.readReal("overview.workspaceNumberBaseSize", 250)
+            property QtObject effects: QtObject {
+                property bool enableBackdrop: root.readBool("overview.effects.enableBackdrop", false)
+                property real backdropOpacity: root.readReal("overview.effects.backdropOpacity", 0.28)
+                property real panelOpacity: root.readReal("overview.effects.panelOpacity", 0.92)
+                property real workspaceOpacity: root.readReal("overview.effects.workspaceOpacity", 0.86)
+                property real emptyWorkspaceWallpaperOverlayOpacity: root.readReal("overview.effects.emptyWorkspaceWallpaperOverlayOpacity", 0.18)
+                property real windowOverlayOpacity: root.readReal("overview.effects.windowOverlayOpacity", 0.22)
+                property bool enableBlur: root.readBool("overview.effects.enableBlur", false)
+                property bool glassMode: root.readBool("overview.effects.glassMode", false)
+                property real glassTintStrength: root.readReal("overview.effects.glassTintStrength", 0.35)
+                property real glassBorderOpacity: root.readReal("overview.effects.glassBorderOpacity", 0.72)
+                property real glassShineOpacity: root.readReal("overview.effects.glassShineOpacity", 0.14)
+            }
+        }
+
+        property QtObject position: QtObject {
+            property int topMargin: root.readInt("position.topMargin", 100)
         }
-        
+
+        property QtObject windowPreview: QtObject {
+            property bool showIcons: root.readBool("windowPreview.showIcons", true)
+            property real iconToWindowRatio: root.readReal("windowPreview.iconToWindowRatio", 0.25)
+            property real iconToWindowRatioCompact: root.readReal("windowPreview.iconToWindowRatioCompact", 0.45)
+            property real xwaylandIndicatorToIconRatio: root.readReal("windowPreview.xwaylandIndicatorToIconRatio", 0.35)
+            property real inactiveMonitorOpacity: root.readReal("windowPreview.inactiveMonitorOpacity", 0.4)
+            property bool cropToFill: root.readBool("windowPreview.cropToFill", false)
+        }
+
         property QtObject hacks: QtObject {
-            property int arbitraryRaceConditionDelay: 150
+            property int arbitraryRaceConditionDelay: root.readInt("hacks.arbitraryRaceConditionDelay", 150)
+            property int hyprlandEventDebounceMs: root.readInt("hacks.hyprlandEventDebounceMs", 40)
+        }
+    }
+
+    Process {
+        id: loadUserConfig
+        command: [
+            "sh",
+            "-lc",
+            "cfg=\"${XDG_CONFIG_HOME:-$HOME/.config}/quickshell/overview/config.json\"; [ -r \"$cfg\" ] && cat \"$cfg\""
+        ]
+        stdout: StdioCollector {
+            id: configCollector
+            onStreamFinished: {
+                const payload = configCollector.text.trim();
+                if (!payload)
+                    return;
+
+                try {
+                    const parsed = JSON.parse(payload);
+                    if (typeof parsed === "object" && parsed !== null) {
+                        root.userOptions = parsed;
+                    } else {
+                        console.warn("overview: config.json must contain a JSON object; ignoring file");
+                    }
+                } catch (error) {
+                    console.warn("overview: failed to parse user config.json; using defaults", error);
+                }
+            }
         }
     }
+
+    Component.onCompleted: {
+        loadUserConfig.running = true;
+    }
 }
diff --git a/config/quickshell/overview/config.example.json b/config/quickshell/overview/config.example.json
new file mode 100644
index 00000000..2f3a4fe9
--- /dev/null
+++ b/config/quickshell/overview/config.example.json
@@ -0,0 +1,96 @@
+{
+  "appearance": {
+    "colorSource": "default",
+    "caelestia": {
+      "autoRefresh": true,
+      "refreshInterval": 2000,
+      "accentProfile": "vibrant"
+    },
+    "rounding": {
+      "unsharpen": 2,
+      "verysmall": 8,
+      "small": 12,
+      "normal": 17,
+      "large": 23,
+      "full": 9999,
+      "screenRounding": 23,
+      "windowRounding": 18
+    },
+    "font": {
+      "family": {
+        "main": "sans-serif",
+        "title": "sans-serif",
+        "expressive": "sans-serif"
+      },
+      "pixelSize": {
+        "smaller": 12,
+        "small": 15,
+        "normal": 16,
+        "larger": 19,
+        "huge": 22
+      }
+    },
+    "animation": {
+      "duration": {
+        "elementMove": 500,
+        "elementMoveEnter": 400,
+        "elementMoveFast": 200
+      }
+    },
+    "sizes": {
+      "elevationMargin": 10
+    }
+  },
+  "overview": {
+    "rows": 2,
+    "columns": 5,
+    "scale": 0.16,
+    "enable": true,
+    "hideEmptyRows": true,
+    "closeOnFocusLoss": true,
+    "useWorkspaceMap": false,
+    "workspaceMap": [0, 10],
+    "orderRightLeft": false,
+    "orderBottomUp": false,
+    "previewsEnabled": true,
+    "previewMode": "live",
+    "includeInactiveMonitorPreviews": true,
+    "previewRecaptureDelayMs": 60,
+    "showSpecialWorkspaces": true,
+    "specialWorkspaces": [],
+    "specialWorkspaceColumns": 5,
+    "emptyWorkspaceWallpaper": "",
+    "specialEmptyWorkspaceWallpaper": "",
+    "effects": {
+      "enableBackdrop": false,
+      "backdropOpacity": 0.28,
+      "panelOpacity": 0.92,
+      "workspaceOpacity": 0.86,
+      "emptyWorkspaceWallpaperOverlayOpacity": 0.18,
+      "windowOverlayOpacity": 0.22,
+      "enableBlur": false,
+      "glassMode": false,
+      "glassTintStrength": 0.35,
+      "glassBorderOpacity": 0.72,
+      "glassShineOpacity": 0.14
+    },
+    "workspaceSpacing": 5,
+    "backgroundPadding": 10,
+    "workspaceNumberBaseSize": 250
+  },
+  "position": {
+    "topMargin": 100
+  },
+  "windowPreview": {
+    "showIcons": true,
+    "iconToWindowRatio": 0.25,
+    "iconToWindowRatioCompact": 0.45,
+    "xwaylandIndicatorToIconRatio": 0.35,
+    "inactiveMonitorOpacity": 0.4,
+    "cropToFill": false
+  },
+  "hacks": {
+    "arbitraryRaceConditionDelay": 150,
+    "hyprlandEventDebounceMs": 40
+  }
+}
diff --git a/config/quickshell/overview/modules/overview/Overview.qml b/config/quickshell/overview/modules/overview/Overview.qml
index b3a299cb..2fb08bb9 100644
--- a/config/quickshell/overview/modules/overview/Overview.qml
+++ b/config/quickshell/overview/modules/overview/Overview.qml
@@ -19,23 +19,23 @@ Scope {
             required property var modelData
             readonly property HyprlandMonitor monitor: Hyprland.monitorFor(root.screen)
             property bool monitorIsFocused: (Hyprland.focusedMonitor?.id == monitor?.id)
+            property bool blurEnabled: Config.options.overview.effects.enableBlur
+            property bool backdropEnabled: Config.options.overview.effects.enableBackdrop
+            property real backdropOpacity: Math.max(0, Math.min(1, Config.options.overview.effects.backdropOpacity))
+            property bool closeOnFocusLoss: Config.options.overview.closeOnFocusLoss ?? true
             screen: modelData
             visible: GlobalStates.overviewOpen
 
-            WlrLayershell.namespace: "quickshell:overview"
+            WlrLayershell.namespace: blurEnabled ? "quickshell:overview-blur" : "quickshell:overview"
             WlrLayershell.layer: WlrLayer.Overlay
             WlrLayershell.keyboardFocus: WlrKeyboardFocus.Exclusive
             color: "transparent"
 
-            mask: Region {
-                item: GlobalStates.overviewOpen ? keyHandler : null
-            }
-
             anchors {
                 top: true
                 bottom: true
-                left: !(Config?.options.overview.enable ?? true) 
-                right: !(Config?.options.overview.enable ?? true) 
+                left: true
+                right: true
             }
 
             HyprlandFocusGrab {
@@ -44,7 +44,8 @@ Scope {
                 property bool canBeActive: root.monitorIsFocused
                 active: false
                 onCleared: () => {
-                    if (!active)
+                    // Only the monitor that owns the grab may close the overview
+                    if (root.closeOnFocusLoss && !active && canBeActive)
                         GlobalStates.overviewOpen = false;
                 }
             }
@@ -58,6 +59,21 @@ Scope {
                 }
             }
 
+            // Re-evaluate grab ownership when focused monitor changes
+            Connections {
+                target: Hyprland
+                function onFocusedMonitorChanged() {
+                    if (!GlobalStates.overviewOpen)
+                        return;
+                    // Transfer the grab to the newly focused monitor
+                    if (root.monitorIsFocused && !grab.active) {
+                        grab.active = true;
+                    } else if (!root.monitorIsFocused && grab.active) {
+                        grab.active = false;
+                    }
+                }
+            }
+
             Timer {
                 id: delayedGrabTimer
                 interval: Config.options.hacks.arbitraryRaceConditionDelay
@@ -69,42 +85,130 @@ Scope {
                 }
             }
 
-            implicitWidth: columnLayout.implicitWidth
-            implicitHeight: columnLayout.implicitHeight
+            // Keep the layershell surface full-screen so backdrop/blur are not constrained by content size.
+            implicitWidth: screen.width
+            implicitHeight: screen.height
 
             Item {
                 id: keyHandler
                 anchors.fill: parent
                 visible: GlobalStates.overviewOpen
                 focus: GlobalStates.overviewOpen
+                z: 0
+
+                Rectangle {
+                    id: backdropLayer
+                    anchors.fill: parent
+                    visible: root.backdropEnabled
+                    color: "#000000"
+                    opacity: root.backdropOpacity
+                    z: 0
+                }
+
+                MouseArea {
+                    id: outsideClickCatcher
+                    anchors.fill: parent
+                    acceptedButtons: Qt.LeftButton | Qt.RightButton | Qt.MiddleButton
+                    enabled: root.closeOnFocusLoss && GlobalStates.overviewOpen
+                    z: 0
+                    onPressed: mouse => {
+                        GlobalStates.overviewOpen = false;
+                        mouse.accepted = true;
+                    }
+                }
 
                 Keys.onPressed: event => {
+                    // close: Escape or Enter
                     if (event.key === Qt.Key_Escape || event.key === Qt.Key_Return) {
                         GlobalStates.overviewOpen = false;
                         event.accepted = true;
-                    } else if (event.key === Qt.Key_Left || event.key === Qt.Key_Right || event.key === Qt.Key_Up || event.key === Qt.Key_Down) {
-                        const workspacesPerGroup = Config.options.overview.rows * Config.options.overview.columns;
-                        const currentId = Hyprland.focusedMonitor?.activeWorkspace?.id ?? 1;
-                        const currentGroup = Math.floor((currentId - 1) / workspacesPerGroup);
-                        const minWorkspaceId = currentGroup * workspacesPerGroup + 1;
-                        const maxWorkspaceId = minWorkspaceId + workspacesPerGroup - 1;
-                        
-                        let targetId;
-                        if (event.key === Qt.Key_Left) {
-                            targetId = currentId - 1;
-                            if (targetId < minWorkspaceId) targetId = maxWorkspaceId;
-                        } else if (event.key === Qt.Key_Right) {
-                            targetId = currentId + 1;
-                            if (targetId > maxWorkspaceId) targetId = minWorkspaceId;
-                        } else if (event.key === Qt.Key_Up) {
-                            targetId = currentId - Config.options.overview.columns;
-                            if (targetId < minWorkspaceId) targetId += workspacesPerGroup;
-                        } else {
-                            targetId = currentId + Config.options.overview.columns;
-                            if (targetId > maxWorkspaceId) targetId -= workspacesPerGroup;
+                        return;
+                    }
+
+                    // Helper: compute current group bounds
+                    const workspacesPerGroup = Config.options.overview.rows * Config.options.overview.columns;
+                    const currentId = Hyprland.focusedMonitor?.activeWorkspace?.id ?? 1;
+                    const useWorkspaceMap = Config.options.overview.useWorkspaceMap;
+                    const workspaceMap = Config.options.overview.workspaceMap ?? [];
+                    const focusedMonitorId = Hyprland.focusedMonitor?.id ?? root.monitor?.id ?? 0;
+                    const workspaceOffset = useWorkspaceMap ? Number(workspaceMap[focusedMonitorId] ?? 0) : 0;
+                    const currentGroup = Math.floor((currentId - workspaceOffset - 1) / workspacesPerGroup);
+                    const minWorkspaceId = currentGroup * workspacesPerGroup + 1 + workspaceOffset;
+                    const maxWorkspaceId = minWorkspaceId + workspacesPerGroup - 1;
+
+                    const rows = Config.options.overview.rows;
+                    const columns = Config.options.overview.columns;
+                    const reverseColumns = Config.options.overview.orderRightLeft;
+                    const reverseRows = Config.options.overview.orderBottomUp;
+
+                    const clampedIndex = Math.max(0, Math.min(workspacesPerGroup - 1, currentId - minWorkspaceId));
+                    const currentNormalRow = Math.floor(clampedIndex / columns);
+                    const currentNormalColumn = clampedIndex % columns;
+
+                    function toVisualRow(normalRow) {
+                        return reverseRows ? (rows - normalRow - 1) : normalRow;
+                    }
+
+                    function toVisualColumn(normalColumn) {
+                        return reverseColumns ? (columns - normalColumn - 1) : normalColumn;
+                    }
+
+                    function toNormalRow(visualRow) {
+                        return reverseRows ? (rows - visualRow - 1) : visualRow;
+                    }
+
+                    function toNormalColumn(visualColumn) {
+                        return reverseColumns ? (columns - visualColumn - 1) : visualColumn;
+                    }
+
+                    let targetVisualRow = toVisualRow(currentNormalRow);
+                    let targetVisualColumn = toVisualColumn(currentNormalColumn);
+
+                    let targetId = null;
+
+                    // Arrow keys and vim-style hjkl
+                    if (event.key === Qt.Key_Left || event.key === Qt.Key_H) {
+                        targetVisualColumn = (targetVisualColumn - 1 + columns) % columns;
+                    } else if (event.key === Qt.Key_Right || event.key === Qt.Key_L) {
+                        targetVisualColumn = (targetVisualColumn + 1) % columns;
+                    } else if (event.key === Qt.Key_Up || event.key === Qt.Key_K) {
+                        targetVisualRow = (targetVisualRow - 1 + rows) % rows;
+                    } else if (event.key === Qt.Key_Down || event.key === Qt.Key_J) {
+                        targetVisualRow = (targetVisualRow + 1) % rows;
+                    }
+
+                    // Number keys: jump to workspace within the current group
+                    // 1-9 map to positions 1-9, 0 maps to position 10
+                    else if (event.key >= Qt.Key_1 && event.key <= Qt.Key_9) {
+                        const position = event.key - Qt.Key_0; // 1-9
+                        if (position <= workspacesPerGroup) {
+                            targetId = minWorkspaceId + position - 1;
                         }
-                        
-                        Hyprland.dispatch("workspace " + targetId);
+                    } else if (event.key === Qt.Key_0) {
+                        // 0 = 10th workspace in the group (if group has 10+ workspaces)
+                        if (workspacesPerGroup >= 10) {
+                            targetId = minWorkspaceId + 9; // 10th position = offset 9
+                        }
+                    }
+
+                    if (targetId === null && (
+                        event.key === Qt.Key_Left || event.key === Qt.Key_H ||
+                        event.key === Qt.Key_Right || event.key === Qt.Key_L ||
+                        event.key === Qt.Key_Up || event.key === Qt.Key_K ||
+                        event.key === Qt.Key_Down || event.key === Qt.Key_J
+                    )) {
+                        const targetNormalRow = toNormalRow(targetVisualRow);
+                        const targetNormalColumn = toNormalColumn(targetVisualColumn);
+                        targetId = minWorkspaceId + targetNormalRow * columns + targetNormalColumn;
+                    }
+
+                    if (targetId !== null) {
+                        const clampedTarget = Math.max(minWorkspaceId, Math.min(maxWorkspaceId, targetId));
+			if (Hyprland.usingLua) {
+				Hyprland.dispatch(`hl.dsp.focus({workspace = '${clampedTarget}'})`);
+			} else {
+				Hyprland.dispatch("workspace " + clampedTarget);
+			}
                         event.accepted = true;
                     }
                 }
@@ -113,15 +217,16 @@ Scope {
             ColumnLayout {
                 id: columnLayout
                 visible: GlobalStates.overviewOpen
+                z: 1
                 anchors {
                     horizontalCenter: parent.horizontalCenter
                     top: parent.top
-                    topMargin: 100
+                    topMargin: Config.options.position.topMargin
                 }
 
                 Loader {
                     id: overviewLoader
-                    active: GlobalStates.overviewOpen && (Config?.options.overview.enable ?? true)
+                    active: Config?.options.overview.enable ?? true
                     sourceComponent: OverviewWidget {
                         panelWindow: root
                         visible: true
@@ -130,7 +235,7 @@ Scope {
             }
         }
     }
-    
+
     IpcHandler {
         target: "overview"
 
diff --git a/config/quickshell/overview/modules/overview/OverviewWidget.qml b/config/quickshell/overview/modules/overview/OverviewWidget.qml
index 7defa64d..6d00803b 100644
--- a/config/quickshell/overview/modules/overview/OverviewWidget.qml
+++ b/config/quickshell/overview/modules/overview/OverviewWidget.qml
@@ -1,4 +1,5 @@
 import QtQuick
+import QtQuick.Effects
 import QtQuick.Layouts
 import Quickshell
 import Quickshell.Wayland
@@ -14,32 +15,347 @@ Item {
     required property var panelWindow
     readonly property HyprlandMonitor monitor: Hyprland.monitorFor(panelWindow.screen)
     readonly property var toplevels: ToplevelManager.toplevels
+    readonly property int effectiveActiveWorkspaceId: Math.max(1, Math.min(100, monitor?.activeWorkspace?.id ?? 1))
     readonly property int workspacesShown: Config.options.overview.rows * Config.options.overview.columns
-    readonly property int workspaceGroup: Math.floor((monitor.activeWorkspace?.id - 1) / workspacesShown)
+    readonly property bool useWorkspaceMap: Config.options.overview.useWorkspaceMap
+    readonly property var workspaceMap: Config.options.overview.workspaceMap
+    readonly property int workspaceOffset: useWorkspaceMap ? Number(workspaceMap[root.monitor?.id] ?? 0) : 0
+    readonly property int workspaceGroup: Math.floor((effectiveActiveWorkspaceId - workspaceOffset - 1) / workspacesShown)
     property bool monitorIsFocused: (Hyprland.focusedMonitor?.name == monitor.name)
     property var windows: HyprlandData.windowList
     property var windowByAddress: HyprlandData.windowByAddress
     property var windowAddresses: HyprlandData.addresses
+    property var workspaceIds: HyprlandData.workspaceIds
     property var monitorData: HyprlandData.monitors.find(m => m.id === root.monitor?.id)
     property real scale: Config.options.overview.scale
     property color activeBorderColor: Appearance.colors.colSecondary
 
-    property real workspaceImplicitWidth: (monitorData?.transform % 2 === 1) ? 
+    property real workspaceImplicitWidth: Math.round((monitorData?.transform % 2 === 1) ?
         ((monitor.height / monitor.scale - (monitorData?.reserved?.[0] ?? 0) - (monitorData?.reserved?.[2] ?? 0)) * root.scale) :
-        ((monitor.width / monitor.scale - (monitorData?.reserved?.[0] ?? 0) - (monitorData?.reserved?.[2] ?? 0)) * root.scale)
-    property real workspaceImplicitHeight: (monitorData?.transform % 2 === 1) ? 
+        ((monitor.width / monitor.scale - (monitorData?.reserved?.[0] ?? 0) - (monitorData?.reserved?.[2] ?? 0)) * root.scale))
+    property real workspaceImplicitHeight: Math.round((monitorData?.transform % 2 === 1) ?
         ((monitor.width / monitor.scale - (monitorData?.reserved?.[1] ?? 0) - (monitorData?.reserved?.[3] ?? 0)) * root.scale) :
-        ((monitor.height / monitor.scale - (monitorData?.reserved?.[1] ?? 0) - (monitorData?.reserved?.[3] ?? 0)) * root.scale)
+        ((monitor.height / monitor.scale - (monitorData?.reserved?.[1] ?? 0) - (monitorData?.reserved?.[3] ?? 0)) * root.scale))
 
     property real workspaceNumberMargin: 80
-    property real workspaceNumberSize: 250 * monitor.scale
+    property real workspaceNumberSize: Config.options.overview.workspaceNumberBaseSize * monitor.scale
     property int workspaceZ: 0
     property int windowZ: 1
     property int windowDraggingZ: 99999
-    property real workspaceSpacing: 5
+    property real workspaceSpacing: Config.options.overview.workspaceSpacing
+    property string emptyWorkspaceWallpaperPath: Config.options.overview.emptyWorkspaceWallpaper
+    property string specialEmptyWorkspaceWallpaperPath: Config.options.overview.specialEmptyWorkspaceWallpaper
+    property bool showSpecialWorkspaces: Config.options.overview.showSpecialWorkspaces
+    property var configuredSpecialWorkspaces: Config.options.overview.specialWorkspaces ?? []
+    property int specialWorkspaceColumns: Math.max(1, Config.options.overview.specialWorkspaceColumns)
+    property real panelOpacity: Math.max(0, Math.min(1, Config.options.overview.effects.panelOpacity))
+    property real workspaceOpacity: Math.max(0, Math.min(1, Config.options.overview.effects.workspaceOpacity))
+    property real emptyWorkspaceWallpaperOverlayOpacity: Math.max(0, Math.min(1, Config.options.overview.effects.emptyWorkspaceWallpaperOverlayOpacity))
+    property bool glassMode: Config.options.overview.effects.glassMode
+    property real glassTintStrength: Math.max(0, Math.min(1, Config.options.overview.effects.glassTintStrength))
+    property real glassBorderOpacity: Math.max(0, Math.min(1, Config.options.overview.effects.glassBorderOpacity))
+    property real glassShineOpacity: Math.max(0, Math.min(1, Config.options.overview.effects.glassShineOpacity))
+    property real effectivePanelOpacity: glassMode ? Math.min(panelOpacity, 0.72) : panelOpacity
+    property real effectiveWorkspaceOpacity: glassMode ? Math.min(workspaceOpacity, 0.62) : workspaceOpacity
 
     property int draggingFromWorkspace: -1
     property int draggingTargetWorkspace: -1
+    property string draggingTargetSpecialWorkspace: ""
+    property int previewRecaptureToken: 0
+    property var allWorkspaces: HyprlandData.allWorkspaces
+    property bool previewsEnabled: Config.options.overview.previewsEnabled
+    property string previewModeRaw: Config.options.overview.previewMode
+    property string previewMode: {
+        const mode = `${previewModeRaw ?? "live"}`.trim().toLowerCase();
+        return (mode === "event" || mode === "snapshot") ? "event" : "live";
+    }
+    property bool useEventPreviewRefresh: previewsEnabled && previewMode === "event"
+
+    readonly property var monitorSpecialWorkspaceNames: {
+        const names = [];
+        for (const ws of (allWorkspaces ?? [])) {
+            const name = `${ws?.name ?? ""}`;
+            if (!name.startsWith("special:"))
+                continue;
+            if (`${ws?.monitor ?? ""}` !== `${root.monitor?.name ?? ""}`)
+                continue;
+            names.push(name.slice(8));
+        }
+        return names;
+    }
+
+    readonly property var specialWorkspaceNamesFromWindows: {
+        const names = [];
+        for (const addr in windowByAddress) {
+            const win = windowByAddress[addr];
+            if ((win?.monitor ?? -1) !== (root.monitor?.id ?? -1))
+                continue;
+            const wsName = `${win?.workspace?.name ?? ""}`;
+            if (!wsName.startsWith("special:"))
+                continue;
+            names.push(wsName.slice(8));
+        }
+        return names;
+    }
+
+    readonly property var visibleSpecialWorkspaces: {
+        if (!showSpecialWorkspaces)
+            return [];
+
+        const out = [];
+        const pushUnique = (value) => {
+            const cleaned = `${value ?? ""}`.trim();
+            if (cleaned.length === 0 || out.includes(cleaned))
+                return;
+            out.push(cleaned);
+        };
+
+        for (const configured of configuredSpecialWorkspaces ?? [])
+            pushUnique(configured);
+        for (const name of monitorSpecialWorkspaceNames)
+            pushUnique(name);
+        for (const name of specialWorkspaceNamesFromWindows)
+            pushUnique(name);
+
+        return out;
+    }
+
+    readonly property bool hasSpecialWorkspaceSection: visibleSpecialWorkspaces.length > 0
+    readonly property bool hasEmptyWorkspaceWallpaper: `${emptyWorkspaceWallpaperPath ?? ""}`.trim().length > 0
+    readonly property bool hasSpecialEmptyWorkspaceWallpaper: `${specialEmptyWorkspaceWallpaperPath ?? ""}`.trim().length > 0
+    readonly property string createSpecialWorkspaceTarget: "__create_special_workspace__"
+    readonly property real specialWorkspaceTileHeight: root.workspaceImplicitHeight
+    readonly property real specialStripGap: workspaceSpacing * 1.8
+    readonly property real specialStripPadding: Math.max(8, 12 * root.scale)
+    readonly property real specialStripTitleHeight: Math.max(14, Appearance.font.pixelSize.small * root.scale)
+    readonly property real specialStripTitleGap: Math.max(6, 8 * root.scale)
+    readonly property int totalSpecialTiles: visibleSpecialWorkspaces.length + 1
+    readonly property real specialSectionWidth: workspaceColumnLayout.implicitWidth
+    readonly property real specialGridInnerWidth: Math.max(0, root.specialSectionWidth - root.specialStripPadding * 2)
+    readonly property int effectiveSpecialColumns: Math.max(1, Math.min(root.specialWorkspaceColumns, root.totalSpecialTiles))
+    readonly property int specialWorkspaceRows: Math.ceil(root.totalSpecialTiles / root.effectiveSpecialColumns)
+    readonly property real specialWorkspaceAspectCap: {
+        let maxAspect = Math.max(1, root.workspaceImplicitWidth / Math.max(1, root.workspaceImplicitHeight));
+        for (const name of visibleSpecialWorkspaces) {
+            const geometry = root.specialWorkspaceGeometry(name, root.monitor?.id);
+            const width = geometry?.width;
+            const height = geometry?.height;
+            if (!Number.isFinite(width) || !Number.isFinite(height) || height <= 0)
+                continue;
+            maxAspect = Math.max(maxAspect, width / height);
+        }
+        return maxAspect;
+    }
+    readonly property real specialWorkspaceTileWidth: {
+        const gaps = Math.max(0, root.effectiveSpecialColumns - 1);
+        const rawWidth = (root.specialGridInnerWidth - gaps * workspaceSpacing) / root.effectiveSpecialColumns;
+        const aspectWidth = root.specialWorkspaceTileHeight * root.specialWorkspaceAspectCap;
+        const cappedWidth = Math.min(rawWidth, aspectWidth);
+        return Math.max(80 * root.scale, cappedWidth);
+    }
+    readonly property real specialGridUsedWidth: root.effectiveSpecialColumns * root.specialWorkspaceTileWidth + Math.max(0, root.effectiveSpecialColumns - 1) * workspaceSpacing
+    readonly property real specialGridOffsetX: root.specialStripPadding + Math.max(0, (root.specialGridInnerWidth - root.specialGridUsedWidth) / 2)
+    readonly property real specialStripTop: workspaceColumnLayout.implicitHeight + workspaceSpacing + root.specialStripGap
+    readonly property real specialStripTilesTop: root.specialStripTop + root.specialStripPadding + root.specialStripTitleHeight + root.specialStripTitleGap
+    readonly property real specialGridHeight: root.specialWorkspaceRows * root.specialWorkspaceTileHeight + Math.max(0, root.specialWorkspaceRows - 1) * workspaceSpacing
+    readonly property real specialStripHeight: root.specialStripPadding * 2 + root.specialStripTitleHeight + root.specialStripTitleGap + root.specialGridHeight
+
+    function getWorkspaceRow(workspaceId) {
+        if (!Number.isFinite(workspaceId))
+            return 0;
+        const adjusted = workspaceId - workspaceOffset;
+        const normalRow = Math.floor((adjusted - 1) / Config.options.overview.columns) % Config.options.overview.rows;
+        return Config.options.overview.orderBottomUp ? (Config.options.overview.rows - normalRow - 1) : normalRow;
+    }
+
+    function getWorkspaceColumn(workspaceId) {
+        if (!Number.isFinite(workspaceId))
+            return 0;
+        const adjusted = workspaceId - workspaceOffset;
+        const normalCol = (adjusted - 1) % Config.options.overview.columns;
+        return Config.options.overview.orderRightLeft ? (Config.options.overview.columns - normalCol - 1) : normalCol;
+    }
+
+    function getWorkspaceInCell(rowIndex, colIndex) {
+        const mappedRow = Config.options.overview.orderBottomUp ? (Config.options.overview.rows - rowIndex - 1) : rowIndex;
+        const mappedCol = Config.options.overview.orderRightLeft ? (Config.options.overview.columns - colIndex - 1) : colIndex;
+        return (workspaceGroup * workspacesShown) + (mappedRow * Config.options.overview.columns) + mappedCol + 1 + workspaceOffset;
+    }
+
+    function getVisibleRowPosition(rowIndex) {
+        if (!Number.isFinite(rowIndex) || rowIndex < 0)
+            return 0;
+        if (!Config.options.overview.hideEmptyRows || !(rowsWithContent instanceof Set))
+            return rowIndex;
+
+        let visibleRow = 0;
+        for (let i = 0; i < rowIndex; i += 1) {
+            if (rowsWithContent.has(i))
+                visibleRow += 1;
+        }
+        return visibleRow;
+    }
+
+    function stepWorkspace(delta) {
+        if (!Number.isFinite(delta) || delta === 0)
+            return;
+
+        const currentId = monitor?.activeWorkspace?.id ?? effectiveActiveWorkspaceId;
+        const minWorkspaceId = workspaceOffset + 1;
+        let maxWorkspaceId = minWorkspaceId + workspacesShown - 1;
+        for (const workspaceId of (workspaceIds ?? [])) {
+            if (Number.isFinite(workspaceId) && workspaceId >= minWorkspaceId) {
+                maxWorkspaceId = Math.max(maxWorkspaceId, workspaceId);
+            }
+        }
+        maxWorkspaceId = Math.max(maxWorkspaceId, currentId);
+
+        let targetId = currentId + delta;
+        if (targetId < minWorkspaceId) {
+            targetId = maxWorkspaceId;
+        } else if (targetId > maxWorkspaceId) {
+            targetId = minWorkspaceId;
+        }
+        if (Hyprland.usingLua) {
+            Hyprland.dispatch(`hl.dsp.focus({workspace = '${targetId}'})`);
+        } else {
+            Hyprland.dispatch(`workspace ${targetId}`);
+        }
+    }
+
+    function isSpecialWorkspace(windowData) {
+        const wsName = `${windowData?.workspace?.name ?? ""}`;
+        return wsName.startsWith("special:");
+    }
+
+    function specialWorkspaceName(windowData) {
+        const wsName = `${windowData?.workspace?.name ?? ""}`;
+        return wsName.startsWith("special:") ? wsName.slice(8) : "";
+    }
+
+    function specialWorkspaceIndex(name) {
+        return visibleSpecialWorkspaces.indexOf(`${name ?? ""}`);
+    }
+
+    function specialWorkspaceLabel(name) {
+        const raw = `${name ?? ""}`.trim();
+        if (raw.length === 0)
+            return "Special";
+        return raw.replace(/[-_]+/g, " ");
+    }
+
+    function nextSpecialWorkspaceName() {
+        const taken = new Set();
+        for (const name of visibleSpecialWorkspaces)
+            taken.add(`${name ?? ""}`.trim().toLowerCase());
+
+        const base = "stash";
+        if (!taken.has(base))
+            return base;
+
+        let index = 2;
+        while (taken.has(`${base}-${index}`))
+            index += 1;
+
+        return `${base}-${index}`;
+    }
+
+    function wallpaperSource(path) {
+        const trimmed = `${path ?? ""}`.trim();
+        if (trimmed.length === 0)
+            return "";
+        if (trimmed.startsWith("file:/") || trimmed.startsWith("qrc:/") || trimmed.startsWith("image://") || trimmed.startsWith("http://") || trimmed.startsWith("https://"))
+            return trimmed;
+        if (trimmed.startsWith("/"))
+            return `file://${trimmed}`;
+        return trimmed;
+    }
+
+    function workspaceHasWindows(workspaceId) {
+        if (!Number.isFinite(workspaceId))
+            return false;
+
+        for (const addr in windowByAddress) {
+            const win = windowByAddress[addr];
+            if (root.isSpecialWorkspace(win))
+                continue;
+            if ((win?.workspace?.id ?? -1) === workspaceId)
+                return true;
+        }
+        return false;
+    }
+
+    function specialWindowZ(win) {
+        const pinned = win?.pinned ? 200000 : 0;
+        const floating = win?.floating ? 100000 : 0;
+        const focus = 10000 - (win?.focusHistoryID ?? 9999);
+        return pinned + floating + focus;
+    }
+
+    function specialWorkspaceGeometry(name, monitorId) {
+        const trimmedName = `${name ?? ""}`.trim();
+        const currentMonitorId = monitorId ?? -1;
+        let minX = null;
+        let minY = null;
+        let maxX = null;
+        let maxY = null;
+
+        for (const addr in windowByAddress) {
+            const win = windowByAddress[addr];
+            if ((win?.monitor ?? -1) !== currentMonitorId)
+                continue;
+            if (root.specialWorkspaceName(win) !== trimmedName)
+                continue;
+
+            const atX = win?.at?.[0];
+            const atY = win?.at?.[1];
+            const width = win?.size?.[0];
+            const height = win?.size?.[1];
+            if (!Number.isFinite(atX) || !Number.isFinite(atY))
+                continue;
+            if (!Number.isFinite(width) || !Number.isFinite(height))
+                continue;
+
+            minX = minX === null ? atX : Math.min(minX, atX);
+            minY = minY === null ? atY : Math.min(minY, atY);
+            maxX = maxX === null ? (atX + width) : Math.max(maxX, atX + width);
+            maxY = maxY === null ? (atY + height) : Math.max(maxY, atY + height);
+        }
+
+        return {
+            x: minX,
+            y: minY,
+            width: (minX !== null && maxX !== null) ? Math.max(1, maxX - minX) : null,
+            height: (minY !== null && maxY !== null) ? Math.max(1, maxY - minY) : null
+        };
+    }
+
+    // Calculate which rows have windows or current workspace
+    property var rowsWithContent: {
+        if (!Config.options.overview.hideEmptyRows) return null;
+
+        let rows = new Set();
+        const firstWorkspace = root.workspaceGroup * root.workspacesShown + 1 + workspaceOffset;
+        const lastWorkspace = (root.workspaceGroup + 1) * root.workspacesShown + workspaceOffset;
+
+        // Add row containing current workspace
+        const currentWorkspace = effectiveActiveWorkspaceId;
+        if (currentWorkspace >= firstWorkspace && currentWorkspace <= lastWorkspace) {
+            rows.add(getWorkspaceRow(currentWorkspace));
+        }
+
+        // Add rows with windows
+        for (let addr in windowByAddress) {
+            const win = windowByAddress[addr];
+            const wsId = win?.workspace?.id;
+            if (wsId >= firstWorkspace && wsId <= lastWorkspace) {
+                const rowIndex = getWorkspaceRow(wsId);
+                rows.add(rowIndex);
+            }
+        }
+
+        return rows;
+    }
 
     implicitWidth: overviewBackground.implicitWidth + Appearance.sizes.elevationMargin * 2
     implicitHeight: overviewBackground.implicitHeight + Appearance.sizes.elevationMargin * 2
@@ -47,41 +363,101 @@ Item {
     property Component windowComponent: OverviewWindow {}
     property list<OverviewWindow> windowWidgets: []
 
+    Connections {
+        target: Hyprland
+        function onRawEvent(event) {
+            if (!GlobalStates.overviewOpen || !root.useEventPreviewRefresh)
+                return;
+
+            const eventName = `${event?.name ?? event?.event ?? event?.type ?? ""}`;
+            if (eventName === "closewindow" || eventName === "openwindow" || eventName === "movewindow") {
+                root.previewRecaptureToken += 1;
+            }
+        }
+    }
+
     StyledRectangularShadow {
         target: overviewBackground
     }
     Rectangle { // Background
         id: overviewBackground
-        property real padding: 10
+        property real padding: Config.options.overview.backgroundPadding
         anchors.fill: parent
         anchors.margins: Appearance.sizes.elevationMargin
 
-        implicitWidth: workspaceColumnLayout.implicitWidth + padding * 2
-        implicitHeight: workspaceColumnLayout.implicitHeight + padding * 2
+        implicitWidth: contentLayout.implicitWidth + padding * 2
+        implicitHeight: contentLayout.implicitHeight + padding * 2
         radius: Appearance.rounding.screenRounding * root.scale + padding
-        color: Appearance.colors.colLayer0
+        clip: true
+        color: ColorUtils.applyAlpha(
+            root.glassMode
+                ? ColorUtils.mix(Appearance.colors.colLayer0, Appearance.colors.colLayer1, 0.78 - root.glassTintStrength * 0.35)
+                : Appearance.colors.colLayer0,
+            root.effectivePanelOpacity
+        )
         border.width: 1
-        border.color: Appearance.colors.colLayer0Border
+        border.color: ColorUtils.applyAlpha(
+            root.glassMode
+                ? ColorUtils.mix(Appearance.colors.colLayer0Border, Appearance.m3colors.m3outline, 0.52)
+                : Appearance.colors.colLayer0Border,
+            root.glassMode ? root.glassBorderOpacity : root.effectivePanelOpacity
+        )
+
+        MouseArea {
+            anchors.fill: parent
+            acceptedButtons: Qt.LeftButton | Qt.RightButton | Qt.MiddleButton
+            onPressed: mouse => mouse.accepted = true
+        }
+
+        Rectangle {
+            visible: root.glassMode
+            anchors.fill: parent
+            radius: parent.radius
+            color: "transparent"
+            gradient: Gradient {
+                GradientStop { position: 0.0; color: ColorUtils.applyAlpha("#FFFFFF", root.glassShineOpacity * 0.35) }
+                GradientStop { position: 0.42; color: ColorUtils.applyAlpha("#FFFFFF", 0.0) }
+                GradientStop { position: 1.0; color: ColorUtils.applyAlpha("#000000", root.glassShineOpacity * 0.22) }
+            }
+        }
+
+        Rectangle {
+            visible: root.glassMode
+            anchors.fill: parent
+            anchors.margins: 1
+            radius: Math.max(parent.radius - 1, 0)
+            color: "transparent"
+            border.width: 1
+            border.color: ColorUtils.applyAlpha("#FFFFFF", root.glassBorderOpacity * 0.20)
+        }
 
         ColumnLayout { // Workspaces
-            id: workspaceColumnLayout
+            id: contentLayout
 
             z: root.workspaceZ
             anchors.centerIn: parent
             spacing: workspaceSpacing
-            Repeater {
-                model: Config.options.overview.rows
-                delegate: RowLayout {
+            ColumnLayout {
+                id: workspaceColumnLayout
+                spacing: workspaceSpacing
+
+                Repeater {
+                    model: Config.options.overview.rows
+                    delegate: RowLayout {
                     id: row
                     property int rowIndex: index
                     spacing: workspaceSpacing
+                    visible: !Config.options.overview.hideEmptyRows ||
+                             (root.rowsWithContent && root.rowsWithContent.has(rowIndex))
+                    height: visible ? implicitHeight : 0
 
                     Repeater { // Workspace repeater
                         model: Config.options.overview.columns
                         Rectangle { // Workspace
                             id: workspace
                             property int colIndex: index
-                            property int workspaceValue: root.workspaceGroup * workspacesShown + rowIndex * Config.options.overview.columns + colIndex + 1
+                            property int workspaceValue: root.getWorkspaceInCell(rowIndex, colIndex)
+                            property bool showWallpaper: root.hasEmptyWorkspaceWallpaper
                             property color defaultWorkspaceColor: Appearance.colors.colLayer1
                             property color hoveredWorkspaceColor: ColorUtils.mix(defaultWorkspaceColor, Appearance.colors.colLayer1Hover, 0.1)
                             property color hoveredBorderColor: Appearance.colors.colLayer2Hover
@@ -89,13 +465,89 @@ Item {
 
                             implicitWidth: root.workspaceImplicitWidth
                             implicitHeight: root.workspaceImplicitHeight
-                            color: hoveredWhileDragging ? hoveredWorkspaceColor : defaultWorkspaceColor
+                            color: showWallpaper ? "transparent" : ColorUtils.applyAlpha(
+                                root.glassMode
+                                    ? ColorUtils.mix(hoveredWhileDragging ? hoveredWorkspaceColor : defaultWorkspaceColor, Appearance.colors.colLayer0, 0.46)
+                                    : (hoveredWhileDragging ? hoveredWorkspaceColor : defaultWorkspaceColor),
+                                root.effectiveWorkspaceOpacity
+                            )
                             radius: Appearance.rounding.screenRounding * root.scale
                             border.width: 2
-                            border.color: hoveredWhileDragging ? hoveredBorderColor : "transparent"
+                            border.color: hoveredWhileDragging
+                                ? ColorUtils.applyAlpha(hoveredBorderColor, root.glassMode ? root.glassBorderOpacity : 1)
+                                : "transparent"
+
+                            Image {
+                                id: workspaceWallpaper
+                                visible: workspace.showWallpaper
+                                anchors.fill: parent
+                                source: root.wallpaperSource(root.emptyWorkspaceWallpaperPath)
+                                fillMode: Image.PreserveAspectCrop
+                                asynchronous: true
+                                cache: true
+                                smooth: true
+                                mipmap: true
+                                layer.enabled: workspace.showWallpaper
+                                layer.smooth: true
+                                layer.effect: MultiEffect {
+                                    maskEnabled: true
+                                    maskSource: workspaceWallpaperMask
+                                    maskThresholdMin: 0.5
+                                    maskSpreadAtMin: 1.0
+                                }
+                            }
+
+                            Item {
+                                id: workspaceWallpaperMask
+                                anchors.fill: parent
+                                visible: false
+                                layer.enabled: true
+                                layer.smooth: true
+                                Rectangle {
+                                    anchors.fill: parent
+                                    radius: workspace.radius
+                                }
+                            }
+
+                            Rectangle {
+                                visible: workspace.showWallpaper
+                                anchors.fill: parent
+                                radius: parent.radius
+                                color: ColorUtils.applyAlpha(
+                                    root.glassMode
+                                        ? ColorUtils.mix(workspace.hoveredWhileDragging ? workspace.hoveredWorkspaceColor : workspace.defaultWorkspaceColor, Appearance.colors.colLayer0, 0.40)
+                                        : (workspace.hoveredWhileDragging ? workspace.hoveredWorkspaceColor : workspace.defaultWorkspaceColor),
+                                    workspace.hoveredWhileDragging
+                                        ? Math.min(0.28, root.emptyWorkspaceWallpaperOverlayOpacity + 0.08)
+                                        : root.emptyWorkspaceWallpaperOverlayOpacity
+                                )
+                            }
+
+                            Rectangle {
+                                visible: root.glassMode
+                                anchors.fill: parent
+                                radius: parent.radius
+                                color: "transparent"
+                                gradient: Gradient {
+                                    GradientStop { position: 0.0; color: ColorUtils.applyAlpha("#FFFFFF", root.glassShineOpacity * 0.22) }
+                                    GradientStop { position: 0.46; color: ColorUtils.applyAlpha("#FFFFFF", 0.0) }
+                                    GradientStop { position: 1.0; color: ColorUtils.applyAlpha("#000000", root.glassShineOpacity * 0.14) }
+                                }
+                            }
+
+                            Rectangle {
+                                visible: root.glassMode
+                                anchors.fill: parent
+                                anchors.margins: 1
+                                radius: Math.max(parent.radius - 1, 0)
+                                color: "transparent"
+                                border.width: 1
+                                border.color: ColorUtils.applyAlpha("#FFFFFF", root.glassBorderOpacity * 0.16)
+                            }
 
                             StyledText {
                                 anchors.centerIn: parent
+                                visible: !workspace.showWallpaper
                                 text: workspaceValue
                                 font {
                                     pixelSize: root.workspaceNumberSize * root.scale
@@ -114,7 +566,11 @@ Item {
                                 onClicked: {
                                     if (root.draggingTargetWorkspace === -1) {
                                         GlobalStates.overviewOpen = false
-                                        Hyprland.dispatch(`workspace ${workspaceValue}`)
+                                        if (Hyprland.usingLua) {
+                                            Hyprland.dispatch(`hl.dsp.focus({workspace = '${workspaceValue}'})`);
+                                        } else {
+                                            Hyprland.dispatch(`workspace ${workspaceValue}`)
+                                        }
                                     }
                                 }
                             }
@@ -123,6 +579,7 @@ Item {
                                 anchors.fill: parent
                                 onEntered: {
                                     root.draggingTargetWorkspace = workspaceValue
+                                    root.draggingTargetSpecialWorkspace = ""
                                     if (root.draggingFromWorkspace == root.draggingTargetWorkspace) return;
                                     hoveredWhileDragging = true
                                 }
@@ -134,6 +591,413 @@ Item {
 
                         }
                     }
+                    }
+                }
+            }
+
+            Item {
+                visible: root.showSpecialWorkspaces
+                implicitWidth: 1
+                implicitHeight: root.specialStripGap
+            }
+
+            Item {
+                id: specialWorkspaceSection
+                visible: root.showSpecialWorkspaces
+                implicitWidth: root.specialSectionWidth
+                implicitHeight: root.specialStripHeight
+
+                Rectangle {
+                    anchors.fill: parent
+                    radius: Appearance.rounding.normal * root.scale
+                    color: ColorUtils.applyAlpha(
+                        root.glassMode
+                            ? ColorUtils.mix(Appearance.colors.colLayer0, Appearance.colors.colLayer1, 0.70)
+                            : Appearance.colors.colLayer1,
+                        root.glassMode ? Math.min(0.74, root.effectivePanelOpacity) : root.effectiveWorkspaceOpacity
+                    )
+                    border.width: 1
+                    border.color: ColorUtils.applyAlpha(Appearance.colors.colLayer2Border, root.glassMode ? root.glassBorderOpacity : 0.65)
+
+                    Rectangle {
+                        anchors.left: parent.left
+                        anchors.right: parent.right
+                        anchors.top: parent.top
+                        height: Math.max(18 * root.scale, root.specialStripPadding + root.specialStripTitleHeight * 0.8)
+                        radius: parent.radius
+                        color: ColorUtils.applyAlpha(Appearance.colors.colSecondary, root.glassMode ? 0.12 : 0.08)
+                    }
+
+                    StyledText {
+                        anchors.left: parent.left
+                        anchors.top: parent.top
+                        anchors.leftMargin: root.specialStripPadding
+                        anchors.topMargin: root.specialStripPadding
+                        text: "Special Workspaces"
+                        font.family: Appearance.font.family.title
+                        font.pixelSize: root.specialStripTitleHeight
+                        font.weight: Font.DemiBold
+                        color: ColorUtils.applyAlpha(Appearance.colors.colOnLayer1, 0.84)
+                    }
+
+                    Grid {
+                        id: specialWorkspaceGrid
+                        x: root.specialGridOffsetX
+                        y: root.specialStripPadding + root.specialStripTitleHeight + root.specialStripTitleGap
+                        width: root.specialGridUsedWidth
+                        columns: root.effectiveSpecialColumns
+                        rowSpacing: workspaceSpacing
+                        columnSpacing: workspaceSpacing
+
+                        Repeater {
+                            model: root.visibleSpecialWorkspaces
+                            delegate: Rectangle {
+                                id: specialWorkspaceTile
+                                required property string modelData
+                                property string specialName: modelData
+                                property var specialGeometry: root.specialWorkspaceGeometry(specialName, root.monitor?.id)
+                                property color baseColor: ColorUtils.mix(Appearance.colors.colLayer1, Appearance.colors.colLayer0, 0.52)
+                                property bool hasRenderableGeometry: Number.isFinite(specialGeometry?.width)
+                                    && Number.isFinite(specialGeometry?.height)
+                                    && specialGeometry.width > 0
+                                    && specialGeometry.height > 0
+                                property bool showWallpaper: root.hasSpecialEmptyWorkspaceWallpaper
+                                property real geometryWidth: hasRenderableGeometry ? specialGeometry.width : Math.max(1, root.workspaceImplicitWidth / root.scale)
+                                property real geometryHeight: hasRenderableGeometry ? specialGeometry.height : Math.max(1, root.workspaceImplicitHeight / root.scale)
+                                property real fitScale: hasRenderableGeometry ? Math.min(width / geometryWidth, height / geometryHeight) : root.scale
+                                property real contentWidth: hasRenderableGeometry ? (geometryWidth * fitScale) : width
+                                property real contentHeight: hasRenderableGeometry ? (geometryHeight * fitScale) : height
+                                property real contentOffsetX: Math.max(0, (width - contentWidth) / 2)
+                                property real contentOffsetY: Math.max(0, (height - contentHeight) / 2)
+                                implicitWidth: root.specialWorkspaceTileWidth
+                                implicitHeight: root.specialWorkspaceTileHeight
+                                radius: Appearance.rounding.screenRounding * root.scale
+                                clip: true
+                                color: showWallpaper ? "transparent" : ColorUtils.applyAlpha(
+                                    root.glassMode
+                                        ? ColorUtils.mix(baseColor, Appearance.colors.colLayer0, 0.44)
+                                        : baseColor,
+                                    root.effectiveWorkspaceOpacity
+                                )
+                                border.width: 1
+                                border.color: ColorUtils.applyAlpha(Appearance.colors.colLayer2Border, root.glassMode ? root.glassBorderOpacity : 0.75)
+
+                                Image {
+                                    visible: specialWorkspaceTile.showWallpaper
+                                    anchors.fill: parent
+                                    source: root.wallpaperSource(root.specialEmptyWorkspaceWallpaperPath)
+                                    fillMode: Image.PreserveAspectCrop
+                                    asynchronous: true
+                                    cache: true
+                                    smooth: true
+                                    mipmap: true
+                                }
+
+                                Rectangle {
+                                    visible: specialWorkspaceTile.showWallpaper
+                                    anchors.fill: parent
+                                    radius: parent.radius
+                                    color: ColorUtils.applyAlpha(
+                                        root.glassMode
+                                            ? ColorUtils.mix(specialWorkspaceTile.baseColor, Appearance.colors.colLayer0, 0.40)
+                                            : specialWorkspaceTile.baseColor,
+                                        root.emptyWorkspaceWallpaperOverlayOpacity
+                                    )
+                                }
+
+                                MouseArea {
+                                    anchors.fill: parent
+                                    acceptedButtons: Qt.LeftButton
+                                    onClicked: {
+                                        if (root.draggingTargetWorkspace === -1 && !root.draggingTargetSpecialWorkspace) {
+                                            GlobalStates.overviewOpen = false;
+                                            if (Hyprland.usingLua) {
+                                                Hyprland.dispatch(`hl.dsp.workspace.toggle_special('${specialWorkspaceTile.specialName}')`);
+                                            } else {
+                                                Hyprland.dispatch(`togglespecialworkspace ${specialWorkspaceTile.specialName}`);
+                                            }
+                                        }
+                                    }
+                                }
+
+                                DropArea {
+                                    anchors.fill: parent
+                                    onEntered: {
+                                        root.draggingTargetWorkspace = -1;
+                                        root.draggingTargetSpecialWorkspace = specialWorkspaceTile.specialName;
+                                    }
+                                    onExited: {
+                                        if (root.draggingTargetSpecialWorkspace === specialWorkspaceTile.specialName)
+                                            root.draggingTargetSpecialWorkspace = "";
+                                    }
+                                }
+
+                                Item {
+                                    id: specialWorkspaceContent
+                                    x: specialWorkspaceTile.contentOffsetX
+                                    y: specialWorkspaceTile.contentOffsetY
+                                    width: specialWorkspaceTile.contentWidth
+                                    height: specialWorkspaceTile.contentHeight
+                                    clip: true
+
+                                    Repeater {
+                                        model: ScriptModel {
+                                            values: {
+                                                if (!specialWorkspaceTile.hasRenderableGeometry)
+                                                    return [];
+                                                return ToplevelManager.toplevels.values.filter((toplevel) => {
+                                                    const address = `0x${toplevel.HyprlandToplevel.address}`;
+                                                    const win = windowByAddress[address];
+                                                    if ((win?.monitor ?? -1) !== (root.monitor?.id ?? -1))
+                                                        return false;
+                                                    return root.specialWorkspaceName(win) === specialWorkspaceTile.specialName;
+                                                }).sort((a, b) => {
+                                                    const addrA = `0x${a.HyprlandToplevel.address}`;
+                                                    const addrB = `0x${b.HyprlandToplevel.address}`;
+                                                    return addrA.localeCompare(addrB);
+                                                });
+                                            }
+                                        }
+                                        delegate: OverviewWindow {
+                                            id: specialWindow
+                                            required property var modelData
+                                            required property int index
+                                            property var address: `0x${modelData.HyprlandToplevel.address}`
+                                            property int monitorId: windowData?.monitor
+                                            property var monitor: HyprlandData.monitors.find(m => m.id === monitorId)
+                                            property Item homeParent: specialWorkspaceContent
+                                            windowData: windowByAddress[address]
+                                            toplevel: modelData
+                                            monitorData: monitor
+                                            widgetMonitorData: root.monitorData
+                                            scale: root.scale
+                                            availableWorkspaceWidth: specialWorkspaceContent.width
+                                            availableWorkspaceHeight: specialWorkspaceContent.height
+                                            positionBaseX: Number.isFinite(specialWorkspaceTile.specialGeometry?.x) ? specialWorkspaceTile.specialGeometry.x : ((monitor?.x ?? 0) + (monitor?.reserved?.[0] ?? 0))
+                                            positionBaseY: Number.isFinite(specialWorkspaceTile.specialGeometry?.y) ? specialWorkspaceTile.specialGeometry.y : ((monitor?.y ?? 0) + (monitor?.reserved?.[1] ?? 0))
+                                            geometryScaleX: specialWorkspaceTile.fitScale / root.scale
+                                            geometryScaleY: specialWorkspaceTile.fitScale / root.scale
+                                            xOffset: 0
+                                            yOffset: 0
+                                            widgetMonitorId: root.monitor.id
+                                            recaptureToken: root.previewRecaptureToken
+                                            restrictToWorkspace: false
+                                            animateSize: false
+                                            z: root.specialWindowZ(windowData)
+
+                                            function moveToDragLayer() {
+                                                const mapped = specialWindow.mapToItem(specialWindowDragLayer, 0, 0);
+                                                specialWindow.suspendPositionAnimation = true;
+                                                specialWindow.parent = specialWindowDragLayer;
+                                                specialWindow.x = mapped.x;
+                                                specialWindow.y = mapped.y;
+                                                specialWindow.z = root.windowDraggingZ + 1;
+                                                Qt.callLater(() => specialWindow.suspendPositionAnimation = false);
+                                            }
+
+                                            function returnToHomeParent() {
+                                                specialWindow.suspendPositionAnimation = true;
+                                                specialWindow.parent = homeParent;
+                                                specialWindow.z = root.specialWindowZ(windowData);
+                                                Qt.callLater(() => specialWindow.suspendPositionAnimation = false);
+                                            }
+
+                                            MouseArea {
+                                                id: specialDragArea
+                                                anchors.fill: parent
+                                                hoverEnabled: true
+                                                onEntered: hovered = true
+                                                onExited: hovered = false
+                                                acceptedButtons: Qt.LeftButton | Qt.MiddleButton
+                                                drag.target: parent
+                                                onPressed: (mouse) => {
+                                                    root.draggingFromWorkspace = -1
+                                                    root.draggingTargetSpecialWorkspace = ""
+                                                    specialWindow.pressed = true
+                                                    specialWindow.dragInProgress = true
+                                                    specialWindow.Drag.source = specialWindow
+                                                    specialWindow.Drag.hotSpot.x = mouse.x
+                                                    specialWindow.Drag.hotSpot.y = mouse.y
+                                                    specialWindow.moveToDragLayer()
+                                                    specialWindow.Drag.active = true
+                                                }
+                                                onReleased: {
+                                                    const targetWorkspace = root.draggingTargetWorkspace
+                                                    const targetSpecialWorkspace = root.draggingTargetSpecialWorkspace
+                                                    specialWindow.pressed = false
+                                                    specialWindow.Drag.active = false
+                                                    specialWindow.dragInProgress = false
+                                                    root.draggingFromWorkspace = -1
+                                                    root.draggingTargetWorkspace = -1
+                                                    root.draggingTargetSpecialWorkspace = ""
+                                                    if (targetSpecialWorkspace === root.createSpecialWorkspaceTarget) {
+                                                        const createdName = root.nextSpecialWorkspaceName()
+                                                        //INFO: From special TO NEW special
+                                                        if (Hyprland.usingLua) {
+                                                            Hyprland.dispatch(`hl.dsp.window.move({workspace = 'special:${createdName}', follow = false, window = 'address:${specialWindow.windowData?.address}'})`);
+                                                        } else {
+                                                            Hyprland.dispatch(`movetoworkspacesilent special:${createdName}, address:${specialWindow.windowData?.address}`)
+                                                        }
+                                                        specialWindow.returnToHomeParent()
+                                                        specialWindow.x = specialWindow.initX
+                                                        specialWindow.y = specialWindow.initY
+                                                    }
+                                                    else if (targetSpecialWorkspace && targetSpecialWorkspace !== specialWorkspaceTile.specialName) {
+                                                        // Idk
+                                                        if (Hyprland.usingLua) {
+                                                            Hyprland.dispatch(`hl.dsp.window.move({workspace = 'special:${targetSpecialWorkspace}', follow = false, window = 'address:${specialWindow.windowData?.address}'})`);
+                                                        } else {
+                                                            Hyprland.dispatch(`movetoworkspacesilent special:${targetSpecialWorkspace}, address:${specialWindow.windowData?.address}`)
+                                                        }
+                                                        specialWindow.returnToHomeParent()
+                                                        specialWindow.x = specialWindow.initX
+                                                        specialWindow.y = specialWindow.initY
+                                                    }
+                                                    else if (targetWorkspace !== -1) {
+                                                        //INFO: From Special TO Normal workspace
+                                                        if (Hyprland.usingLua) {
+                                                            Hyprland.dispatch(`hl.dsp.window.move({workspace = '${targetWorkspace}', follow = false, window = 'address:${specialWindow.windowData?.address}'})`);
+                                                        } else {
+                                                            Hyprland.dispatch(`movetoworkspacesilent ${targetWorkspace}, address:${specialWindow.windowData?.address}`)
+                                                        }
+                                                        specialWindow.returnToHomeParent()
+                                                        specialWindow.x = specialWindow.initX
+                                                        specialWindow.y = specialWindow.initY
+                                                    }
+                                                    else {
+                                                        specialWindow.returnToHomeParent()
+                                                        specialWindow.x = specialWindow.initX
+                                                        specialWindow.y = specialWindow.initY
+                                                    }
+                                                }
+                                                onClicked: (event) => {
+                                                    if (!windowData)
+                                                        return;
+                                                    if (event.button === Qt.LeftButton) {
+                                                        GlobalStates.overviewOpen = false;
+                                                        if (Hyprland.usingLua) {
+                                                            Hyprland.dispatch(`hl.dsp.focus({ window = 'address:${windowData.address}' })`);
+                                                        } else {
+                                                            Hyprland.dispatch(`focuswindow address:${windowData.address}`);
+                                                        }
+                                                        event.accepted = true;
+                                                    } else if (event.button === Qt.MiddleButton) {
+                                                        if (Hyprland.usingLua) {
+                                                            Hyprland.dispatch(`hl.dsp.window.close('address:${windowData.address}')`);
+                                                        } else {
+                                                            Hyprland.dispatch(`closewindow address:${windowData.address}`);
+                                                        }
+                                                        event.accepted = true;
+                                                    }
+                                                }
+
+                                                StyledToolTip {
+                                                    extraVisibleCondition: false
+                                                    alternativeVisibleCondition: specialDragArea.containsMouse && !specialWindow.Drag.active
+                                                    text: `${windowData?.title ?? "Unknown"}\n[${windowData?.class ?? "unknown"}] ${windowData?.xwayland ? "[XWayland] " : ""}`
+                                                }
+                                            }
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                        Rectangle {
+                            id: createSpecialWorkspaceTile
+                            property bool showWallpaper: root.hasSpecialEmptyWorkspaceWallpaper
+                            implicitWidth: root.specialWorkspaceTileWidth
+                            implicitHeight: root.specialWorkspaceTileHeight
+                            radius: Appearance.rounding.screenRounding * root.scale
+                            color: showWallpaper ? "transparent" : ColorUtils.applyAlpha(
+                                root.glassMode
+                                    ? ColorUtils.mix(Appearance.colors.colSecondaryContainer, Appearance.colors.colLayer1, 0.58)
+                                    : ColorUtils.mix(Appearance.colors.colLayer2, Appearance.colors.colLayer1, 0.55),
+                                root.draggingTargetSpecialWorkspace === root.createSpecialWorkspaceTarget ? 0.90 : root.effectiveWorkspaceOpacity
+                            )
+                            border.width: 1
+                            border.color: root.draggingTargetSpecialWorkspace === root.createSpecialWorkspaceTarget
+                                ? ColorUtils.applyAlpha(root.activeBorderColor, 0.96)
+                                : ColorUtils.applyAlpha(Appearance.colors.colSecondary, 0.46)
+
+                            Image {
+                                visible: createSpecialWorkspaceTile.showWallpaper
+                                anchors.fill: parent
+                                source: root.wallpaperSource(root.specialEmptyWorkspaceWallpaperPath)
+                                fillMode: Image.PreserveAspectCrop
+                                asynchronous: true
+                                cache: true
+                                smooth: true
+                                mipmap: true
+                            }
+
+                            Rectangle {
+                                visible: createSpecialWorkspaceTile.showWallpaper
+                                anchors.fill: parent
+                                radius: parent.radius
+                                color: ColorUtils.applyAlpha(
+                                    root.glassMode
+                                        ? ColorUtils.mix(Appearance.colors.colSecondaryContainer, Appearance.colors.colLayer0, 0.40)
+                                        : ColorUtils.mix(Appearance.colors.colLayer2, Appearance.colors.colLayer1, 0.55),
+                                    root.draggingTargetSpecialWorkspace === root.createSpecialWorkspaceTarget
+                                        ? Math.min(0.28, root.emptyWorkspaceWallpaperOverlayOpacity + 0.08)
+                                        : root.emptyWorkspaceWallpaperOverlayOpacity
+                                )
+                            }
+
+                            Rectangle {
+                                anchors.fill: parent
+                                anchors.margins: 1
+                                radius: Math.max(parent.radius - 1, 0)
+                                color: "transparent"
+                                border.width: 1
+                                border.color: ColorUtils.applyAlpha("#FFFFFF", root.glassMode ? 0.12 : 0.08)
+                            }
+
+                            Column {
+                                anchors.centerIn: parent
+                                spacing: 0
+
+                                StyledText {
+                                    anchors.horizontalCenter: parent.horizontalCenter
+                                    visible: !createSpecialWorkspaceTile.showWallpaper
+                                    text: root.draggingTargetSpecialWorkspace === root.createSpecialWorkspaceTarget ? "Release" : "+"
+                                    font.family: Appearance.font.family.expressive
+                                    font.pixelSize: root.draggingTargetSpecialWorkspace === root.createSpecialWorkspaceTarget
+                                        ? Appearance.font.pixelSize.larger * root.scale
+                                        : Appearance.font.pixelSize.huge * 1.25 * root.scale
+                                    font.weight: Font.DemiBold
+                                    color: ColorUtils.applyAlpha(Appearance.colors.colOnLayer1, 0.92)
+                                    horizontalAlignment: Text.AlignHCenter
+                                }
+                            }
+
+                            MouseArea {
+                                anchors.fill: parent
+                                acceptedButtons: Qt.LeftButton
+                                onClicked: {
+                                    const createdName = root.nextSpecialWorkspaceName();
+                                    GlobalStates.overviewOpen = false;
+                                    if (Hyprland.usingLua) {
+                                        Hyprland.dispatch(`hl.dsp.workspace.toggle_special('${createdName}')`);
+                                    } else {
+                                        Hyprland.dispatch(`togglespecialworkspace ${createdName}`);
+                                    }
+                                }
+                            }
+
+                            DropArea {
+                                anchors.fill: parent
+                                onEntered: {
+                                    root.draggingTargetWorkspace = -1;
+                                    root.draggingTargetSpecialWorkspace = root.createSpecialWorkspaceTarget;
+                                }
+                                onExited: {
+                                    if (root.draggingTargetSpecialWorkspace === root.createSpecialWorkspaceTarget)
+                                        root.draggingTargetSpecialWorkspace = "";
+                                }
+                            }
+                        }
+                    }
                 }
             }
         }
@@ -141,8 +1005,20 @@ Item {
         Item { // Windows & focused workspace indicator
             id: windowSpace
             anchors.centerIn: parent
-            implicitWidth: workspaceColumnLayout.implicitWidth
-            implicitHeight: workspaceColumnLayout.implicitHeight
+            implicitWidth: contentLayout.implicitWidth
+            implicitHeight: contentLayout.implicitHeight
+
+            WheelHandler {
+                target: null
+                acceptedDevices: PointerDevice.Mouse | PointerDevice.TouchPad
+                onWheel: event => {
+                    const deltaY = event.angleDelta.y;
+                    if (!deltaY)
+                        return;
+                    root.stepWorkspace(deltaY > 0 ? -1 : 1);
+                    event.accepted = true;
+                }
+            }
 
             Repeater { // Window repeater
                 model: ScriptModel {
@@ -150,7 +1026,11 @@ Item {
                         return ToplevelManager.toplevels.values.filter((toplevel) => {
                             const address = `0x${toplevel.HyprlandToplevel.address}`
                             var win = windowByAddress[address]
-                            const inWorkspaceGroup = (root.workspaceGroup * root.workspacesShown < win?.workspace?.id && win?.workspace?.id <= (root.workspaceGroup + 1) * root.workspacesShown)
+                            if (root.isSpecialWorkspace(win))
+                                return false;
+                            const minWorkspace = root.workspaceGroup * root.workspacesShown + 1 + workspaceOffset;
+                            const maxWorkspace = (root.workspaceGroup + 1) * root.workspacesShown + workspaceOffset;
+                            const inWorkspaceGroup = (minWorkspace <= win?.workspace?.id && win?.workspace?.id <= maxWorkspace)
                             return inWorkspaceGroup;
                         }).sort((a, b) => {
                             // Proper stacking order based on Hyprland's window properties
@@ -158,17 +1038,17 @@ Item {
                             const addrB = `0x${b.HyprlandToplevel.address}`
                             const winA = windowByAddress[addrA]
                             const winB = windowByAddress[addrB]
-                            
+
                             // 1. Pinned windows are always on top
                             if (winA?.pinned !== winB?.pinned) {
                                 return winA?.pinned ? 1 : -1
                             }
-                            
+
                             // 2. Floating windows above tiled windows
                             if (winA?.floating !== winB?.floating) {
                                 return winA?.floating ? 1 : -1
                             }
-                            
+
                             // 3. Within same category, sort by focus history
                             // Lower focusHistoryID = more recently focused = higher in stack
                             return (winB?.focusHistoryID ?? 0) - (winA?.focusHistoryID ?? 0)
@@ -185,31 +1065,20 @@ Item {
                     windowData: windowByAddress[address]
                     toplevel: modelData
                     monitorData: monitor
-                    
-                    // Calculate scale relative to window's source monitor
-                    property real sourceMonitorWidth: (monitor?.transform % 2 === 1) ? 
-                        (monitor?.height ?? 1920) / (monitor?.scale ?? 1) - (monitor?.reserved?.[0] ?? 0) - (monitor?.reserved?.[2] ?? 0) :
-                        (monitor?.width ?? 1920) / (monitor?.scale ?? 1) - (monitor?.reserved?.[0] ?? 0) - (monitor?.reserved?.[2] ?? 0)
-                    property real sourceMonitorHeight: (monitor?.transform % 2 === 1) ?
-                        (monitor?.width ?? 1080) / (monitor?.scale ?? 1) - (monitor?.reserved?.[1] ?? 0) - (monitor?.reserved?.[3] ?? 0) :
-                        (monitor?.height ?? 1080) / (monitor?.scale ?? 1) - (monitor?.reserved?.[1] ?? 0) - (monitor?.reserved?.[3] ?? 0)
-                    
-                    // Scale windows to fit the workspace size, accounting for different monitor sizes
-                    scale: Math.min(
-                        root.workspaceImplicitWidth / sourceMonitorWidth,
-                        root.workspaceImplicitHeight / sourceMonitorHeight
-                    )
-                    
+                    widgetMonitorData: root.monitorData
+                    scale: root.scale
                     availableWorkspaceWidth: root.workspaceImplicitWidth
                     availableWorkspaceHeight: root.workspaceImplicitHeight
                     widgetMonitorId: root.monitor.id
+                    recaptureToken: root.previewRecaptureToken
 
                     property bool atInitPosition: (initX == x && initY == y)
 
-                    property int workspaceColIndex: (windowData?.workspace.id - 1) % Config.options.overview.columns
-                    property int workspaceRowIndex: Math.floor((windowData?.workspace.id - 1) % root.workspacesShown / Config.options.overview.columns)
+                    property int workspaceColIndex: root.getWorkspaceColumn(windowData?.workspace.id)
+                    property int workspaceRowIndex: root.getWorkspaceRow(windowData?.workspace.id)
+                    property int visibleWorkspaceRowIndex: root.getVisibleRowPosition(workspaceRowIndex)
                     xOffset: (root.workspaceImplicitWidth + workspaceSpacing) * workspaceColIndex
-                    yOffset: (root.workspaceImplicitHeight + workspaceSpacing) * workspaceRowIndex
+                    yOffset: (root.workspaceImplicitHeight + workspaceSpacing) * visibleWorkspaceRowIndex
 
                     Timer {
                         id: updateWindowPosition
@@ -217,8 +1086,8 @@ Item {
                         repeat: false
                         running: false
                         onTriggered: {
-                            window.x = Math.round(Math.max((windowData?.at[0] - (monitor?.x ?? 0) - (monitorData?.reserved?.[0] ?? 0)) * root.scale, 0) + xOffset)
-                            window.y = Math.round(Math.max((windowData?.at[1] - (monitor?.y ?? 0) - (monitorData?.reserved?.[1] ?? 0)) * root.scale, 0) + yOffset)
+                            window.x = Math.round(Math.max((windowData?.at[0] - (monitor?.x ?? 0) - (monitorData?.reserved?.[0] ?? 0)) * root.scale * window.widthRatio, 0) + xOffset)
+                            window.y = Math.round(Math.max((windowData?.at[1] - (monitor?.y ?? 0) - (monitorData?.reserved?.[1] ?? 0)) * root.scale * window.heightRatio, 0) + yOffset)
                         }
                     }
 
@@ -235,6 +1104,7 @@ Item {
                         drag.target: parent
                         onPressed: (mouse) => {
                             root.draggingFromWorkspace = windowData?.workspace.id
+                            root.draggingTargetSpecialWorkspace = ""
                             window.pressed = true
                             window.Drag.active = true
                             window.Drag.source = window
@@ -243,11 +1113,38 @@ Item {
                         }
                         onReleased: {
                             const targetWorkspace = root.draggingTargetWorkspace
+                            const targetSpecialWorkspace = root.draggingTargetSpecialWorkspace
                             window.pressed = false
                             window.Drag.active = false
                             root.draggingFromWorkspace = -1
-                            if (targetWorkspace !== -1 && targetWorkspace !== windowData?.workspace.id) {
-                                Hyprland.dispatch(`movetoworkspacesilent ${targetWorkspace}, address:${window.windowData?.address}`)
+                            root.draggingTargetWorkspace = -1
+                            root.draggingTargetSpecialWorkspace = ""
+                            if (targetSpecialWorkspace === root.createSpecialWorkspaceTarget) {
+                                const createdName = root.nextSpecialWorkspaceName()
+                                //INFO: From normal TO special
+                                if (Hyprland.usingLua) {
+                                    Hyprland.dispatch(`hl.dsp.window.move({workspace = 'special:${createdName}', follow = false, window = 'address:${window.windowData?.address}'})`);
+                                } else {
+                                    Hyprland.dispatch(`movetoworkspacesilent special:${createdName}, address:${window.windowData?.address}`)
+                                }
+                                updateWindowPosition.restart()
+                            }
+                            else if (targetSpecialWorkspace && targetSpecialWorkspace !== root.specialWorkspaceName(windowData)) {
+                                // Idk
+                                if (Hyprland.usingLua) {
+                                    Hyprland.dispatch(`hl.dsp.window.move({workspace = 'special:${targetSpecialWorkspace}', follow = false, window = 'address:${window.windowData?.address}'})`);
+                                } else {
+                                    Hyprland.dispatch(`movetoworkspacesilent special:${targetSpecialWorkspace}, address:${window.windowData?.address}`)
+                                }
+                                updateWindowPosition.restart()
+                            }
+                            else if (targetWorkspace !== -1 && targetWorkspace !== windowData?.workspace.id) {
+                                //INFO: From normal TO normal
+                                if (Hyprland.usingLua) {
+                                    Hyprland.dispatch(`hl.dsp.window.move({workspace = '${targetWorkspace}', follow = false, window = 'address:${window.windowData?.address}'})`);
+                                } else {
+                                    Hyprland.dispatch(`movetoworkspacesilent ${targetWorkspace}, address:${window.windowData?.address}`)
+                                }
                                 updateWindowPosition.restart()
                             }
                             else {
@@ -260,10 +1157,18 @@ Item {
 
                             if (event.button === Qt.LeftButton) {
                                 GlobalStates.overviewOpen = false
-                                Hyprland.dispatch(`focuswindow address:${windowData.address}`)
+                                if (Hyprland.usingLua) {
+                                    Hyprland.dispatch(`hl.dsp.focus({ window = 'address:${windowData.address}' })`);
+                                } else {
+                                    Hyprland.dispatch(`focuswindow address:${windowData.address}`)
+                                }
                                 event.accepted = true
                             } else if (event.button === Qt.MiddleButton) {
-                                Hyprland.dispatch(`closewindow address:${windowData.address}`)
+                                if (Hyprland.usingLua) {
+                                    Hyprland.dispatch(`hl.dsp.window.close('address:${windowData.address}')`);
+                                } else {
+                                    Hyprland.dispatch(`closewindow address:${windowData.address}`)
+                                }
                                 event.accepted = true
                             }
                         }
@@ -279,12 +1184,12 @@ Item {
 
             Rectangle { // Focused workspace indicator
                 id: focusedWorkspaceIndicator
-                property int activeWorkspaceInGroup: monitor.activeWorkspace?.id - (root.workspaceGroup * root.workspacesShown)
-                property int activeWorkspaceRowIndex: Math.floor((activeWorkspaceInGroup - 1) / Config.options.overview.columns)
-                property int activeWorkspaceColIndex: (activeWorkspaceInGroup - 1) % Config.options.overview.columns
+                property int activeWorkspaceRowIndex: root.getWorkspaceRow(root.effectiveActiveWorkspaceId)
+                property int visibleActiveWorkspaceRowIndex: root.getVisibleRowPosition(activeWorkspaceRowIndex)
+                property int activeWorkspaceColIndex: root.getWorkspaceColumn(root.effectiveActiveWorkspaceId)
                 x: (root.workspaceImplicitWidth + workspaceSpacing) * activeWorkspaceColIndex
-                y: (root.workspaceImplicitHeight + workspaceSpacing) * activeWorkspaceRowIndex
-                z: root.windowZ
+                y: (root.workspaceImplicitHeight + workspaceSpacing) * visibleActiveWorkspaceRowIndex
+                z: root.windowDraggingZ - 1
                 width: root.workspaceImplicitWidth
                 height: root.workspaceImplicitHeight
                 color: "transparent"
@@ -299,5 +1204,11 @@ Item {
                 }
             }
         }
+
+        Item {
+            id: specialWindowDragLayer
+            anchors.fill: parent
+            z: root.windowDraggingZ + 1
+        }
     }
 }
diff --git a/config/quickshell/overview/modules/overview/OverviewWindow.qml b/config/quickshell/overview/modules/overview/OverviewWindow.qml
index fac3e22e..3b2652a9 100644
--- a/config/quickshell/overview/modules/overview/OverviewWindow.qml
+++ b/config/quickshell/overview/modules/overview/OverviewWindow.qml
@@ -1,6 +1,6 @@
-import QtQuick.Effects
 import QtQuick
 import QtQuick.Layouts
+import QtQuick.Effects
 import Quickshell
 import Quickshell.Wayland
 import "../../common"
@@ -12,75 +12,197 @@ Item { // Window
     property var toplevel
     property var windowData
     property var monitorData
+    property var widgetMonitorData
     property var scale
     property var availableWorkspaceWidth
     property var availableWorkspaceHeight
+    property real positionBaseX: (monitorData?.x ?? 0) + (monitorData?.reserved?.[0] ?? 0)
+    property real positionBaseY: (monitorData?.y ?? 0) + (monitorData?.reserved?.[1] ?? 0)
+    property int recaptureToken: 0
     property bool restrictToWorkspace: true
-    property real initX: Math.max(((windowData?.at[0] ?? 0) - (monitorData?.x ?? 0) - (monitorData?.reserved?.[0] ?? 0)) * root.scale, 0) + xOffset
-    property real initY: Math.max(((windowData?.at[1] ?? 0) - (monitorData?.y ?? 0) - (monitorData?.reserved?.[1] ?? 0)) * root.scale, 0) + yOffset
+    property real widthRatio: {
+        if (!widgetMonitorData || !monitorData)
+            return 1;
+
+        const widgetWidth = (widgetMonitorData.transform % 2 === 1) ? (widgetMonitorData.height ?? 1) : (widgetMonitorData.width ?? 1);
+        const sourceWidth = (monitorData.transform % 2 === 1) ? (monitorData.height ?? 1) : (monitorData.width ?? 1);
+        const sourceScale = monitorData.scale ?? 1;
+        const widgetScale = widgetMonitorData.scale ?? 1;
+        return (widgetWidth * sourceScale) / (sourceWidth * widgetScale);
+    }
+    property real heightRatio: {
+        if (!widgetMonitorData || !monitorData)
+            return 1;
+
+        const widgetHeight = (widgetMonitorData.transform % 2 === 1) ? (widgetMonitorData.width ?? 1) : (widgetMonitorData.height ?? 1);
+        const sourceHeight = (monitorData.transform % 2 === 1) ? (monitorData.width ?? 1) : (monitorData.height ?? 1);
+        const sourceScale = monitorData.scale ?? 1;
+        const widgetScale = widgetMonitorData.scale ?? 1;
+        return (widgetHeight * sourceScale) / (sourceHeight * widgetScale);
+    }
+    property real initX: Math.max(((windowData?.at[0] ?? 0) - positionBaseX) * root.scale * geometryScaleX, 0) + xOffset
+    property real initY: Math.max(((windowData?.at[1] ?? 0) - positionBaseY) * root.scale * geometryScaleY, 0) + yOffset
     property real xOffset: 0
     property real yOffset: 0
     property int widgetMonitorId: 0
+    property real geometryScaleX: widthRatio
+    property real geometryScaleY: heightRatio
     
-    property var targetWindowWidth: (windowData?.size[0] ?? 100) * scale
-    property var targetWindowHeight: (windowData?.size[1] ?? 100) * scale
+    property var targetWindowWidth: (windowData?.size[0] ?? 100) * scale * geometryScaleX
+    property var targetWindowHeight: (windowData?.size[1] ?? 100) * scale * geometryScaleY
     property bool hovered: false
     property bool pressed: false
 
-    property var iconToWindowRatio: 0.25
-    property var xwaylandIndicatorToIconRatio: 0.35
-    property var iconToWindowRatioCompact: 0.45
-    property var entry: DesktopEntries.heuristicLookup(windowData?.class)
-    property var iconPath: Quickshell.iconPath(entry?.icon ?? windowData?.class ?? "application-x-executable", "image-missing")
+    property bool showIcons: Config.options.windowPreview.showIcons
+    property var iconToWindowRatio: Config.options.windowPreview.iconToWindowRatio
+    property var xwaylandIndicatorToIconRatio: Config.options.windowPreview.xwaylandIndicatorToIconRatio
+    property var iconToWindowRatioCompact: Config.options.windowPreview.iconToWindowRatioCompact
+    property bool cropToFill: Config.options.windowPreview.cropToFill
+    property bool previewsEnabled: Config.options.overview.previewsEnabled
+    property bool includeInactiveMonitorPreviews: Config.options.overview.includeInactiveMonitorPreviews
+    property int previewRecaptureDelayMs: Config.options.overview.previewRecaptureDelayMs
+    property real windowOverlayOpacity: Math.max(0, Math.min(1, Config.options.overview.effects.windowOverlayOpacity))
+    property bool glassMode: Config.options.overview.effects.glassMode
+    property real glassShineOpacity: Math.max(0, Math.min(1, Config.options.overview.effects.glassShineOpacity))
+    property real effectiveWindowOverlayOpacity: glassMode ? Math.min(windowOverlayOpacity, 0.10) : windowOverlayOpacity
+    property string previewModeRaw: Config.options.overview.previewMode
+    property string previewMode: {
+        const mode = `${previewModeRaw ?? "live"}`.trim().toLowerCase();
+        return (mode === "event" || mode === "snapshot") ? "event" : "live";
+    }
+    property bool livePreviewEnabled: previewsEnabled && previewMode === "live"
+    property bool shouldCapturePreview: {
+        if (!GlobalStates.overviewOpen || !previewsEnabled || !previewCaptureEnabled)
+            return false;
+        if (includeInactiveMonitorPreviews)
+            return true;
+        return (windowData?.monitor ?? -1) === widgetMonitorId;
+    }
+    property var entry: {
+        DesktopEntries.applications.values; // re-run when the entry index updates
+        return DesktopEntries.heuristicLookup(windowData?.class);
+    }
+    property string iconName: {
+        const raw = `${entry?.icon ?? ""}`.trim();
+        const withoutProviderPrefix = raw.replace(/^image:\/\/icon\//, "");
+        const withoutQuery = withoutProviderPrefix.split("?")[0].trim();
+        return withoutQuery.length > 0 ? withoutQuery : "application-x-executable";
+    }
+    property var iconPath: Quickshell.iconPath(iconName, "image-missing")
     property bool compactMode: Appearance.font.pixelSize.smaller * 4 > targetWindowHeight || Appearance.font.pixelSize.smaller * 4 > targetWindowWidth
 
     property bool indicateXWayland: windowData?.xwayland ?? false
+    property bool previewCaptureEnabled: true
+    property bool initialized: false
+    property bool dragInProgress: false
+    property bool suspendPositionAnimation: false
+    property bool animateSize: true
     
     x: initX
     y: initY
-    width: Math.min((windowData?.size[0] ?? 100) * root.scale, availableWorkspaceWidth)
-    height: Math.min((windowData?.size[1] ?? 100) * root.scale, availableWorkspaceHeight)
-    opacity: (windowData?.monitor ?? -1) == widgetMonitorId ? 1 : 0.4
+    width: Math.min(targetWindowWidth, availableWorkspaceWidth)
+    height: Math.min(targetWindowHeight, availableWorkspaceHeight)
+    opacity: (windowData?.monitor ?? -1) == widgetMonitorId ? 1 : Config.options.windowPreview.inactiveMonitorOpacity
+    visible: {
+        const thisWsId = windowData?.workspace?.id;
+        const isFullscreen = (windowData?.fullscreen ?? 0) > 0;
+        if (isFullscreen || thisWsId === undefined) return true;
+        return !HyprlandData.windowList.some(w => w.workspace?.id === thisWsId && (w.fullscreen ?? 0) > 0);
+    }
 
-    layer.enabled: true
-    layer.smooth: true
-    layer.mipmap: true
+    clip: true
+    Component.onCompleted: Qt.callLater(() => root.initialized = true)
 
     Behavior on x {
+        enabled: root.initialized && !root.dragInProgress && !root.suspendPositionAnimation
         animation: Appearance.animation.elementMoveEnter.numberAnimation.createObject(this)
     }
     Behavior on y {
+        enabled: root.initialized && !root.dragInProgress && !root.suspendPositionAnimation
         animation: Appearance.animation.elementMoveEnter.numberAnimation.createObject(this)
     }
     Behavior on width {
+        enabled: root.initialized && root.animateSize && !root.dragInProgress && !root.suspendPositionAnimation
         animation: Appearance.animation.elementMoveEnter.numberAnimation.createObject(this)
     }
     Behavior on height {
+        enabled: root.initialized && root.animateSize && !root.dragInProgress && !root.suspendPositionAnimation
         animation: Appearance.animation.elementMoveEnter.numberAnimation.createObject(this)
     }
 
+    // Opaque background for windows on the active monitor.
+    // The simplest solution for making those windows fully opaque and not interacting with actual
+    // windows behind the overview, e.g., applying blur to them.
     Rectangle {
-        id: clipContainer
+        visible: (root.windowData?.monitor ?? -1) === root.widgetMonitorId
         anchors.fill: parent
         radius: Appearance.rounding.windowRounding * root.scale
-        clip: true
-        color: "transparent"
+        color: root.glassMode
+            ? ColorUtils.mix(Appearance.colors.colLayer2, Appearance.colors.colLayer0, 0.38)
+            : Appearance.colors.colLayer2
+    }
 
-        ScreencopyView {
-            id: windowPreview
-            anchors.fill: parent
-            captureSource: GlobalStates.overviewOpen ? root.toplevel : null
-            live: true
+    ScreencopyView {
+        id: windowPreview
+        readonly property real srcAspect: {
+            const w = root.windowData?.size?.[0] ?? 0;
+            const h = root.windowData?.size?.[1] ?? 0;
+            return (w > 0 && h > 0) ? (w / h) : 1;
+        }
+        anchors.centerIn: parent
+        width: root.cropToFill
+            ? Math.max(parent.width, parent.height * srcAspect)
+            : Math.min(parent.width, parent.height * srcAspect)
+        height: root.cropToFill
+            ? Math.max(parent.height, parent.width / srcAspect)
+            : Math.min(parent.height, parent.width / srcAspect)
+        captureSource: shouldCapturePreview ? root.toplevel : null
+        live: livePreviewEnabled
+        layer.enabled: true
+        layer.smooth: true
+        layer.effect: MultiEffect {
+            maskEnabled: true
+            maskSource: previewMask
+            maskThresholdMin: 0.5
+            maskSpreadAtMin: 1.0
+        }
+    }
 
-            Rectangle {
-                anchors.fill: parent
-                radius: Appearance.rounding.windowRounding * root.scale
-                color: pressed ? ColorUtils.transparentize(Appearance.colors.colLayer2Active, 0.5) : 
-                    hovered ? ColorUtils.transparentize(Appearance.colors.colLayer2Hover, 0.7) : 
-                    ColorUtils.transparentize(Appearance.colors.colLayer2)
-                border.color : ColorUtils.transparentize(Appearance.m3colors.m3outline, 0.7)
-                border.width : 1
+    Rectangle {
+        anchors.fill: parent
+        radius: Appearance.rounding.windowRounding * root.scale
+        color: pressed ? ColorUtils.applyAlpha(Appearance.colors.colLayer2Active, Math.min(1, root.effectiveWindowOverlayOpacity + 0.30)) :
+            hovered ? ColorUtils.applyAlpha(Appearance.colors.colLayer2Hover, Math.min(1, root.effectiveWindowOverlayOpacity + 0.20)) :
+            ColorUtils.applyAlpha(
+                root.glassMode ? ColorUtils.mix(Appearance.colors.colLayer2, Appearance.colors.colLayer0, 0.38) : Appearance.colors.colLayer2,
+                root.effectiveWindowOverlayOpacity
+            )
+        border.color: root.glassMode
+            ? ColorUtils.applyAlpha(Appearance.m3colors.m3outline, 0.62)
+            : ColorUtils.transparentize(Appearance.m3colors.m3outline, 0.7)
+        border.width: 1
+
+        Rectangle {
+            visible: root.glassMode
+            anchors.fill: parent
+            radius: parent.radius
+            color: "transparent"
+            gradient: Gradient {
+                GradientStop { position: 0.0; color: ColorUtils.applyAlpha("#FFFFFF", root.glassShineOpacity * 0.24) }
+                GradientStop { position: 0.5; color: ColorUtils.applyAlpha("#FFFFFF", 0.0) }
+                GradientStop { position: 1.0; color: ColorUtils.applyAlpha("#000000", root.glassShineOpacity * 0.14) }
             }
+        }
+
+        Rectangle {
+            visible: root.glassMode
+            anchors.fill: parent
+            anchors.margins: 1
+            radius: Math.max(parent.radius - 1, 0)
+            color: "transparent"
+            border.width: 1
+            border.color: ColorUtils.applyAlpha("#FFFFFF", root.glassShineOpacity * 0.32)
+        }
 
         ColumnLayout {
             anchors.verticalCenter: parent.verticalCenter
@@ -90,23 +212,53 @@ Item { // Window
 
             Image {
                 id: windowIcon
+                visible: root.showIcons
                 property var iconSize: {
-                    return Math.min(targetWindowWidth, targetWindowHeight) * (root.compactMode ? root.iconToWindowRatioCompact : root.iconToWindowRatio) / (root.monitorData?.scale ?? 1);
+                    const renderedSize = Math.min(root.width, root.height);
+                    return renderedSize * (root.compactMode ? root.iconToWindowRatioCompact : root.iconToWindowRatio) / (root.monitorData?.scale ?? 1);
                 }
                 Layout.alignment: Qt.AlignHCenter
                 source: root.iconPath
                 width: iconSize
                 height: iconSize
-                sourceSize: Qt.size(iconSize, iconSize)
-
-                Behavior on width {
-                    animation: Appearance.animation.elementMoveEnter.numberAnimation.createObject(this)
-                }
-                Behavior on height {
-                    animation: Appearance.animation.elementMoveEnter.numberAnimation.createObject(this)
-                }
+                sourceSize: Qt.size(Math.max(1, Math.round(iconSize)), Math.max(1, Math.round(iconSize)))
             }
         }
     }
+
+    Item {
+        id: previewMask
+        width: windowPreview.width
+        height: windowPreview.height
+        anchors.centerIn: parent
+        visible: false
+        layer.enabled: true
+        layer.smooth: true
+        Rectangle {
+            anchors.centerIn: parent
+            width: root.width
+            height: root.height
+            radius: Appearance.rounding.windowRounding * root.scale
+        }
+    }
+
+    function refreshCapture() {
+        if (!GlobalStates.overviewOpen || livePreviewEnabled || !previewsEnabled)
+            return;
+
+        root.previewCaptureEnabled = false;
+        previewResetTimer.restart();
+    }
+
+    Timer {
+        id: previewResetTimer
+        interval: Math.max(1, previewRecaptureDelayMs)
+        repeat: false
+        onTriggered: root.previewCaptureEnabled = true
+    }
+
+    onRecaptureTokenChanged: {
+        if (recaptureToken > 0)
+            root.refreshCapture();
     }
 }
diff --git a/config/quickshell/overview/quickshell-overview.qml b/config/quickshell/overview/quickshell-overview.qml
new file mode 100644
index 00000000..95176b4e
--- /dev/null
+++ b/config/quickshell/overview/quickshell-overview.qml
@@ -0,0 +1,41 @@
+
+import QtQuick
+
+QtObject {
+    id: m3
+
+    property color m3primary: "{{colors.primary.default.hex}}"
+    property color m3onPrimary: "{{colors.on_primary.default.hex}}"
+
+    property color m3primaryContainer: "{{colors.primary_container.default.hex}}"
+    property color m3onPrimaryContainer: "{{colors.on_primary_container.default.hex}}"
+
+    property color m3secondary: "{{colors.secondary.default.hex}}"
+    property color m3onSecondary: "{{colors.on_secondary.default.hex}}"
+
+    property color m3secondaryContainer: "{{colors.secondary_container.default.hex}}"
+    property color m3onSecondaryContainer: "{{colors.on_secondary_container.default.hex}}"
+
+    property color m3background: "{{colors.background.default.hex}}"
+    property color m3onBackground: "{{colors.on_background.default.hex}}"
+
+    property color m3surface: "{{colors.surface.default.hex}}"
+
+    property color m3surfaceContainerLow: "{{colors.surface_container_low.default.hex}}"
+    property color m3surfaceContainer: "{{colors.surface_container.default.hex}}"
+    property color m3surfaceContainerHigh: "{{colors.surface_container_high.default.hex}}"
+    property color m3surfaceContainerHighest: "{{colors.surface_container_highest.default.hex}}"
+
+    property color m3onSurface: "{{colors.on_surface.default.hex}}"
+
+    property color m3surfaceVariant: "{{colors.surface_variant.default.hex}}"
+    property color m3onSurfaceVariant: "{{colors.on_surface_variant.default.hex}}"
+
+    property color m3inverseSurface: "{{colors.inverse_surface.default.hex}}"
+    property color m3inverseOnSurface: "{{colors.inverse_on_surface.default.hex}}"
+
+    property color m3outline: "{{colors.outline.default.hex}}"
+    property color m3outlineVariant: "{{colors.outline_variant.default.hex}}"
+
+    property color m3shadow: "#000000"
+}
diff --git a/config/quickshell/overview/services/HyprlandData.qml b/config/quickshell/overview/services/HyprlandData.qml
index e23472d0..6127e989 100644
--- a/config/quickshell/overview/services/HyprlandData.qml
+++ b/config/quickshell/overview/services/HyprlandData.qml
@@ -5,6 +5,7 @@ import QtQuick
 import Quickshell
 import Quickshell.Io
 import Quickshell.Hyprland
+import "../common"
 
 /**
  * Provides access to some Hyprland data not available in Quickshell.Hyprland.
@@ -15,11 +16,17 @@ Singleton {
     property var addresses: []
     property var windowByAddress: ({})
     property var workspaces: []
+    property var allWorkspaces: []
     property var workspaceIds: []
     property var workspaceById: ({})
     property var activeWorkspace: null
     property var monitors: []
     property var layers: ({})
+    property bool pendingWindowsUpdate: false
+    property bool pendingMonitorsUpdate: false
+    property bool pendingLayersUpdate: false
+    property bool pendingWorkspacesUpdate: false
+    property bool pendingActiveWorkspaceUpdate: false
 
     function updateWindowList() {
         getClients.running = true;
@@ -39,10 +46,46 @@ Singleton {
     }
 
     function updateAll() {
-        updateWindowList();
-        updateMonitors();
-        updateLayers();
-        updateWorkspaces();
+        scheduleUpdates(true, true, true, true, true);
+    }
+
+    function scheduleUpdates(windows, monitors, layers, workspaces, activeWorkspace) {
+        pendingWindowsUpdate = pendingWindowsUpdate || !!windows;
+        pendingMonitorsUpdate = pendingMonitorsUpdate || !!monitors;
+        pendingLayersUpdate = pendingLayersUpdate || !!layers;
+        pendingWorkspacesUpdate = pendingWorkspacesUpdate || !!workspaces;
+        pendingActiveWorkspaceUpdate = pendingActiveWorkspaceUpdate || !!activeWorkspace;
+
+        const debounceMs = Math.max(0, Config.options.hacks.hyprlandEventDebounceMs);
+        if (debounceMs === 0) {
+            flushPendingUpdates();
+        } else {
+            eventDebounceTimer.interval = debounceMs;
+            eventDebounceTimer.restart();
+        }
+    }
+
+    function flushPendingUpdates() {
+        if (pendingWindowsUpdate) {
+            pendingWindowsUpdate = false;
+            updateWindowList();
+        }
+        if (pendingMonitorsUpdate) {
+            pendingMonitorsUpdate = false;
+            updateMonitors();
+        }
+        if (pendingLayersUpdate) {
+            pendingLayersUpdate = false;
+            updateLayers();
+        }
+        if (pendingWorkspacesUpdate) {
+            pendingWorkspacesUpdate = false;
+            getWorkspaces.running = true;
+        }
+        if (pendingActiveWorkspaceUpdate) {
+            pendingActiveWorkspaceUpdate = false;
+            getActiveWorkspace.running = true;
+        }
     }
 
     function biggestWindowForWorkspace(workspaceId) {
@@ -55,24 +98,51 @@ Singleton {
     }
 
     Component.onCompleted: {
-        updateAll();
+        scheduleUpdates(true, true, true, true, true);
+        flushPendingUpdates();
     }
 
     Connections {
         target: Hyprland
 
         function onRawEvent(event) {
-            updateAll()
+            const eventName = `${event?.name ?? event?.event ?? event?.type ?? ""}`;
+            if (["openlayer", "closelayer", "screencast"].includes(eventName))
+                return;
+
+            if (eventName === "openwindow" || eventName === "closewindow" || eventName === "movewindow" || eventName === "movewindowv2" || eventName === "windowtitle") {
+                scheduleUpdates(true, false, false, true, false);
+                return;
+            }
+
+            if (eventName === "workspace" || eventName === "workspacev2" || eventName === "focusedmon" || eventName === "focusedmonv2" || eventName === "activewindow" || eventName === "activewindowv2") {
+                scheduleUpdates(false, false, false, true, true);
+                return;
+            }
+
+            if (eventName.startsWith("monitor") || eventName === "configreloaded") {
+                scheduleUpdates(true, true, false, true, true);
+                return;
+            }
+
+            scheduleUpdates(true, true, true, true, true);
         }
     }
 
+    Timer {
+        id: eventDebounceTimer
+        interval: Math.max(0, Config.options.hacks.hyprlandEventDebounceMs)
+        repeat: false
+        onTriggered: root.flushPendingUpdates()
+    }
+
     Process {
         id: getClients
         command: ["hyprctl", "clients", "-j"]
         stdout: StdioCollector {
             id: clientsCollector
             onStreamFinished: {
-                root.windowList = JSON.parse(clientsCollector.text)
+                root.windowList = JSON.parse(clientsCollector.text);
                 let tempWinByAddress = {};
                 for (var i = 0; i < root.windowList.length; ++i) {
                     var win = root.windowList[i];
@@ -112,7 +182,9 @@ Singleton {
         stdout: StdioCollector {
             id: workspacesCollector
             onStreamFinished: {
-                root.workspaces = JSON.parse(workspacesCollector.text);
+                const rawWorkspaces = JSON.parse(workspacesCollector.text);
+                root.allWorkspaces = rawWorkspaces;
+                root.workspaces = rawWorkspaces.filter(ws => ws.id >= 1 && ws.id <= 100);
                 let tempWorkspaceById = {};
                 for (var i = 0; i < root.workspaces.length; ++i) {
                     var ws = root.workspaces[i];
diff --git a/config/quickshell/overview/shell.qml b/config/quickshell/overview/shell.qml
index e92b4eb7..7fc9e0ee 100644
--- a/config/quickshell/overview/shell.qml
+++ b/config/quickshell/overview/shell.qml
@@ -1,5 +1,6 @@
 //@ pragma UseQApplication
 //@ pragma Env QT_QUICK_CONTROLS_STYLE=Basic
+//@ pragma Env QT_QPA_PLATFORMTHEME=
 
 import "./modules/overview/"
 import "./services/"
@@ -12,5 +13,13 @@ import Quickshell
 import Quickshell.Hyprland
 
 ShellRoot {
+    Connections {
+        target: Quickshell
+
+        function onReloadCompleted() {
+            Quickshell.inhibitReloadPopup();
+        }
+    }
+
     Overview {}
 }
author	Don Williams <Don.e.williams@gmail.com>	2026-07-04 17:28:36 -0400
committer	Pinapelz <yukais@pinapelz.com>	2026-08-29 21:39:35 -0700
commit	e974676da74ca270b289f789ae055e3a9b4012fe (patch)
tree	e43881adb8d2ab15b85d009e7ad85999d6f61416 /config
parent	2f4b617fbb4214e50ae0bc44fd4acb5385731c75 (diff)