diff --git a/android/app/capacitor.build.gradle b/android/app/capacitor.build.gradle
index 8abfd517..5b1074a7 100644
--- a/android/app/capacitor.build.gradle
+++ b/android/app/capacitor.build.gradle
@@ -10,6 +10,7 @@ android {
 apply from: "../capacitor-cordova-android-plugins/cordova.variables.gradle"
 dependencies {
     implementation project(':byteowls-capacitor-filesharer')
+    implementation project(':capacitor-community-keep-awake')
     implementation project(':capacitor-community-volume-buttons')
     implementation project(':capacitor-app')
     implementation project(':capacitor-browser')
diff --git a/android/app/src/main/assets/capacitor.plugins.json b/android/app/src/main/assets/capacitor.plugins.json
index d4a8fdf9..e3977c36 100644
--- a/android/app/src/main/assets/capacitor.plugins.json
+++ b/android/app/src/main/assets/capacitor.plugins.json
@@ -3,6 +3,10 @@
 		"pkg": "@byteowls/capacitor-filesharer",
 		"classpath": "com.byteowls.capacitor.filesharer.FileSharerPlugin"
 	},
+	{
+		"pkg": "@capacitor-community/keep-awake",
+		"classpath": "com.getcapacitor.community.keepawake.KeepAwakePlugin"
+	},
 	{
 		"pkg": "@capacitor-community/volume-buttons",
 		"classpath": "com.ryltsov.alex.plugins.volume.buttons.VolumeButtonsPlugin"
diff --git a/android/capacitor.settings.gradle b/android/capacitor.settings.gradle
index c9e8de60..ce3d71fa 100644
--- a/android/capacitor.settings.gradle
+++ b/android/capacitor.settings.gradle
@@ -5,6 +5,9 @@ project(':capacitor-android').projectDir = new File('../node_modules/@capacitor/
 include ':byteowls-capacitor-filesharer'
 project(':byteowls-capacitor-filesharer').projectDir = new File('../node_modules/@byteowls/capacitor-filesharer/android')
 
+include ':capacitor-community-keep-awake'
+project(':capacitor-community-keep-awake').projectDir = new File('../node_modules/@capacitor-community/keep-awake/android')
+
 include ':capacitor-community-volume-buttons'
 project(':capacitor-community-volume-buttons').projectDir = new File('../node_modules/@capacitor-community/volume-buttons/android')
 
diff --git a/components/readers/Reader.vue b/components/readers/Reader.vue
index d1f5e60e..635722a6 100644
--- a/components/readers/Reader.vue
+++ b/components/readers/Reader.vue
@@ -66,45 +66,51 @@
           <div class="w-full h-full px-4">
             <div class="flex items-center mb-6">
               <div class="w-32">
-                <p class="text-base">{{ $strings.LabelTheme }}:</p>
+                <p class="text-sm">{{ $strings.LabelTheme }}</p>
               </div>
-              <ui-toggle-btns v-model="ereaderSettings.theme" :items="themeItems" @input="settingsUpdated" />
+              <ui-toggle-btns v-model="ereaderSettings.theme" name="theme" :items="themeItems" @input="settingsUpdated" />
             </div>
             <div class="flex items-center mb-6">
               <div class="w-32">
-                <p class="text-base">{{ $strings.LabelFontScale }}:</p>
+                <p class="text-sm">{{ $strings.LabelFontScale }}</p>
               </div>
               <ui-range-input v-model="ereaderSettings.fontScale" :min="5" :max="300" :step="5" input-width="180px" @input="settingsUpdated" />
             </div>
             <div class="flex items-center mb-6">
               <div class="w-32">
-                <p class="text-base">{{ $strings.LabelLineSpacing }}:</p>
+                <p class="text-sm">{{ $strings.LabelLineSpacing }}</p>
               </div>
               <ui-range-input v-model="ereaderSettings.lineSpacing" :min="100" :max="300" :step="5" input-width="180px" @input="settingsUpdated" />
             </div>
             <div class="flex items-center mb-6">
               <div class="w-32">
-                <p class="text-base">{{ $strings.LabelFontBoldness }}:</p>
+                <p class="text-sm">{{ $strings.LabelFontBoldness }}</p>
               </div>
               <ui-range-input v-model="ereaderSettings.textStroke" :min="0" :max="300" :step="5" input-width="180px" @input="settingsUpdated" />
             </div>
             <div class="flex items-center mb-6">
               <div class="w-32">
-                <p class="text-base">{{ $strings.LabelLayout }}:</p>
+                <p class="text-sm">{{ $strings.LabelLayout }}</p>
               </div>
-              <ui-toggle-btns v-model="ereaderSettings.spread" :items="spreadItems" @input="settingsUpdated" />
+              <ui-toggle-btns v-model="ereaderSettings.spread" name="spread" :items="spreadItems" @input="settingsUpdated" />
             </div>
             <div class="flex items-center mb-6">
               <div class="w-32">
-                <p class="text-base">{{ $strings.LabelNavigateWithVolume }}:</p>
+                <p class="text-sm">{{ $strings.LabelNavigateWithVolume }}</p>
               </div>
-              <ui-toggle-btns v-model="ereaderSettings.navigateWithVolume" :items="navigateWithVolumeItems" @input="settingsUpdated" />
+              <ui-toggle-btns v-model="ereaderSettings.navigateWithVolume" name="navigate-volume" :items="navigateWithVolumeItems" @input="settingsUpdated" />
+            </div>
+            <div class="flex items-center mb-6">
+              <div class="w-32">
+                <p class="text-sm">{{ $strings.LabelNavigateWithVolumeWhilePlaying }}</p>
+              </div>
+              <ui-toggle-btns v-model="ereaderSettings.navigateWithVolumeWhilePlaying" name="navigate-volume-playing" :items="onOffToggleButtonItems" @input="settingsUpdated" />
             </div>
             <div class="flex items-center">
               <div class="w-32">
-                <p class="text-base">{{ $strings.LabelNavigateWithVolumeWhilePlaying }}:</p>
+                <p class="text-sm">{{ $strings.LabelKeepScreenAwake }}</p>
               </div>
-              <ui-toggle-btns v-model="ereaderSettings.navigateWithVolumeWhilePlaying" :items="navigateWithVolumeWhilePlayingItems" @input="settingsUpdated" />
+              <ui-toggle-btns v-model="ereaderSettings.keepScreenAwake" name="keep-awake" :items="onOffToggleButtonItems" @input="settingsUpdated" />
             </div>
           </div>
         </div>
@@ -116,6 +122,7 @@
 <script>
 import { Capacitor } from '@capacitor/core'
 import { VolumeButtons } from '@capacitor-community/volume-buttons'
+import { KeepAwake } from '@capacitor-community/keep-awake'
 
 export default {
   data() {
@@ -139,7 +146,8 @@ export default {
         spread: 'auto',
         textStroke: 0,
         navigateWithVolume: 'enabled',
-        navigateWithVolumeWhilePlaying: false
+        navigateWithVolumeWhilePlaying: false,
+        keepScreenAwake: false
       }
     }
   },
@@ -216,7 +224,7 @@ export default {
         }
       ]
     },
-    navigateWithVolumeWhilePlayingItems() {
+    onOffToggleButtonItems() {
       return [
         {
           text: this.$strings.LabelOn,
@@ -314,6 +322,7 @@ export default {
       localStorage.setItem('ereaderSettings', JSON.stringify(this.ereaderSettings))
 
       this.initWatchVolume()
+      this.initKeepScreenAwake()
     },
     goToChapter(href) {
       this.showTOCModal = false
@@ -459,11 +468,25 @@ export default {
 
       this.isInittingWatchVolume = false
     },
+    async initKeepScreenAwake() {
+      try {
+        if (this.ereaderSettings.keepScreenAwake) {
+          await KeepAwake.keepAwake()
+          console.log('Reader keep screen awake enabled')
+        } else {
+          await KeepAwake.allowSleep()
+          console.log('Reader keep screen awake disabled')
+        }
+      } catch (error) {
+        console.error('Failed to init keep screen awake', error)
+      }
+    },
     registerListeners() {
       this.$eventBus.$on('close-ebook', this.closeEvt)
       document.body.addEventListener('touchstart', this.touchstart)
       document.body.addEventListener('touchend', this.touchend)
       this.initWatchVolume()
+      this.initKeepScreenAwake()
     },
     unregisterListeners() {
       this.$eventBus.$on('close-ebook', this.closeEvt)
@@ -472,6 +495,9 @@ export default {
       VolumeButtons.clearWatch().catch((error) => {
         console.error('Failed to clear volume watch', error)
       })
+      KeepAwake.allowSleep().catch((error) => {
+        console.error('Failed to allow sleep', error)
+      })
     },
     volumePressed(e) {
       if (this.ereaderSettings.navigateWithVolume == 'enabled') {
diff --git a/components/ui/ToggleBtns.vue b/components/ui/ToggleBtns.vue
index 5b54684e..0d274674 100644
--- a/components/ui/ToggleBtns.vue
+++ b/components/ui/ToggleBtns.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="inline-flex toggle-btn-wrapper shadow-md">
-    <button v-for="item in items" :key="item.value" type="button" class="toggle-btn outline-none relative border border-border px-4 py-1" :class="{ selected: item.value === value }" @click.stop="clickBtn(item.value)">
+    <button v-for="(item, index) in items" :key="`${name}-${index}`" type="button" class="toggle-btn outline-none relative border border-border px-4 py-1" :class="{ selected: item.value === value }" @click.stop="clickBtn(item.value)">
       {{ item.text }}
     </button>
   </div>
@@ -9,7 +9,8 @@
 <script>
 export default {
   props: {
-    value: String,
+    name: String,
+    value: [String, Number, Boolean],
     items: {
       type: Array,
       default: Object
diff --git a/package-lock.json b/package-lock.json
index 6eaf6790..39ed3167 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,6 +9,7 @@
       "version": "0.9.77-beta",
       "dependencies": {
         "@byteowls/capacitor-filesharer": "^6.0.0",
+        "@capacitor-community/keep-awake": "^5.0.1",
         "@capacitor-community/volume-buttons": "^6.0.1",
         "@capacitor/android": "^6.0.0",
         "@capacitor/app": "^6.0.0",
@@ -1750,6 +1751,15 @@
         "@capacitor/core": ">=6"
       }
     },
+    "node_modules/@capacitor-community/keep-awake": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/@capacitor-community/keep-awake/-/keep-awake-5.0.1.tgz",
+      "integrity": "sha512-5ZeJ5DQE5Aa1NwzD1kKv8IkHoLwKhkGYlURWHh4/SDrug0KBaGocKuk1q1TAk1nsCs6ndbSsEvUt2LZDoPo9SQ==",
+      "license": "MIT",
+      "peerDependencies": {
+        "@capacitor/core": "^6.0.0"
+      }
+    },
     "node_modules/@capacitor-community/volume-buttons": {
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/@capacitor-community/volume-buttons/-/volume-buttons-6.0.1.tgz",
diff --git a/package.json b/package.json
index de53c8f0..9608c7aa 100644
--- a/package.json
+++ b/package.json
@@ -10,10 +10,12 @@
     "sync": "nuxt generate && npx cap sync",
     "icons-android": "cordova-res android --skip-config --copy",
     "ionic:build": "npm run build",
-    "ionic:serve": "npm run start"
+    "ionic:serve": "npm run dev",
+    "devlive": "ionic cap run -l --external --port=1337"
   },
   "dependencies": {
     "@byteowls/capacitor-filesharer": "^6.0.0",
+    "@capacitor-community/keep-awake": "^5.0.1",
     "@capacitor-community/volume-buttons": "^6.0.1",
     "@capacitor/android": "^6.0.0",
     "@capacitor/app": "^6.0.0",
diff --git a/strings/en-us.json b/strings/en-us.json
index 23877df7..c3f6d664 100644
--- a/strings/en-us.json
+++ b/strings/en-us.json
@@ -163,6 +163,7 @@
   "LabelInternalAppStorage": "Internal App Storage",
   "LabelJumpBackwardsTime": "Jump backwards time",
   "LabelJumpForwardsTime": "Jump forwards time",
+  "LabelKeepScreenAwake": "Keep screen awake",
   "LabelLanguage": "Language",
   "LabelLayout": "Layout",
   "LabelLayoutAuto": "Auto",