diff --git a/package.json b/package.json
index 3244fc58..6fa453ad 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "toshokan",
-  "version": "0.2.35",
+  "version": "0.2.36",
   "private": true,
   "scripts": {
     "dev": "vite",
diff --git a/src/components/Alert.vue b/src/components/Alert.vue
index ae6052da..4201ee6f 100644
--- a/src/components/Alert.vue
+++ b/src/components/Alert.vue
@@ -125,10 +125,11 @@ export default {
 }
 </script>
 
-<style lang="postcss" scoped>
-.alert-actions a,
-.alert-actions button {
-  @apply font-semibold rounded-md px-2.5 py-1.5 motion-safe:transition-shadow;
+<style lang="postcss">
+.alert-actions > a,
+.alert-actions > button {
+  @apply font-semibold rounded-md px-2.5 py-1.5
+    motion-safe:transition-shadow;
 }
 
 .alert-actions a:hover,
diff --git a/src/components/AppNavbar.vue b/src/components/AppNavbar.vue
index db0d2a1c..6cee8696 100644
--- a/src/components/AppNavbar.vue
+++ b/src/components/AppNavbar.vue
@@ -10,7 +10,7 @@
       <div class="relative flex items-center justify-between h-16">
         <div class="flex-1 flex items-center justify-start md:items-stretch">
           <router-link
-            :to="{ name: 'DashboardHome' }"
+            :to="{ name: 'Home' }"
             :class="isOnTop ? 'opacity-95' : ''"
             class="shrink-0 flex items-center rounded-md transition-shadow motion-reduce:transition-none focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary-500 focus-visible:ring-offset-gray-800"
           >
diff --git a/src/components/BasicBarChart.vue b/src/components/BasicBarChart.vue
index e181ccee..3fecbc42 100644
--- a/src/components/BasicBarChart.vue
+++ b/src/components/BasicBarChart.vue
@@ -32,8 +32,7 @@
 </template>
 
 <script>
-import { computed, toRefs } from 'vue'
-import { useStore } from 'vuex'
+import { computed, defineAsyncComponent, toRefs } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import colors from 'tailwindcss/colors'
@@ -43,8 +42,6 @@ import useMotionSafe from '@/composables/useMotionSafe'
 
 import { ChartBarIcon } from '@heroicons/vue/solid'
 
-import VueApexCharts from 'vue3-apexcharts'
-
 import apexEnUs from 'apexcharts/dist/locales/en.json'
 import apexPtBr from 'apexcharts/dist/locales/pt-br.json'
 
@@ -55,7 +52,7 @@ const apexLocales = {
 
 export default {
   components: {
-    ApexChart: VueApexCharts,
+    ApexChart: defineAsyncComponent(() => import('vue3-apexcharts')),
     ChartBarIcon
   },
 
@@ -67,8 +64,6 @@ export default {
   },
 
   setup (props) {
-    const store = useStore()
-
     const { locale } = useI18n()
 
     const { darkMode } = useDarkMode()
diff --git a/src/components/Content.vue b/src/components/Content.vue
index cdc55baa..c768b9a3 100644
--- a/src/components/Content.vue
+++ b/src/components/Content.vue
@@ -6,6 +6,6 @@
 
 <style lang="postcss" scoped>
 .content {
-  @apply max-w-prose mx-auto py-16 px-6 lg:px-0;
+  @apply max-w-prose mx-auto pb-8 px-6 lg:px-0;
 }
 </style>
diff --git a/src/components/ContentTitle.vue b/src/components/ContentTitle.vue
index 6adf5885..a49e07c4 100644
--- a/src/components/ContentTitle.vue
+++ b/src/components/ContentTitle.vue
@@ -6,6 +6,8 @@
 
 <style lang="postcss" scoped>
 .content-title {
-  @apply pb-16 text-center font-display font-bold leading-6 text-3xl text-gray-800 dark:text-gray-100;
+  @apply py-20 md:py-24 text-center font-display
+    font-bold leading-7 text-3xl md:text-4xl
+    text-gray-800 dark:text-gray-100;
 }
 </style>
diff --git a/src/components/HomeFooter.vue b/src/components/HomeFooter.vue
index dc14bb3e..aed20e44 100644
--- a/src/components/HomeFooter.vue
+++ b/src/components/HomeFooter.vue
@@ -31,40 +31,24 @@
 
     <div class="text-center">
       <p>
-        {{ t('footer.version', { version: appVersion }) }}
-      </p>
-
-      <p v-if="isDev">
-        {{ t('footer.dev') }}
+        {{ t('footer.copyright', { year: new Date().getFullYear() }) }}
       </p>
     </div>
   </footer>
 </template>
 
 <script>
-import { ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import LocaleSelector from '@/components/LocaleSelector.vue'
 
-import useAppInfo from '@/composables/useAppInfo'
-
 export default {
   components: { LocaleSelector },
 
   setup () {
-    const { appVersion } = useAppInfo()
-
-    const isDev = ref(import.meta.env.DEV)
-
     const { t, locale } = useI18n({ useScope: 'global' })
 
-    return {
-      appVersion,
-      isDev,
-      t,
-      locale
-    }
+    return { t, locale }
   }
 }
 </script>
diff --git a/src/components/MonthlyBoughtsChart.vue b/src/components/MonthlyBoughtsChart.vue
index 79239a75..7e1cee3f 100644
--- a/src/components/MonthlyBoughtsChart.vue
+++ b/src/components/MonthlyBoughtsChart.vue
@@ -35,7 +35,7 @@
 </template>
 
 <script>
-import { computed } from 'vue'
+import { computed, defineAsyncComponent } from 'vue'
 import { useStore } from 'vuex'
 import { useI18n } from 'vue-i18n'
 
@@ -46,8 +46,6 @@ import useMotionSafe from '@/composables/useMotionSafe'
 
 import { ChartBarIcon } from '@heroicons/vue/solid'
 
-import VueApexCharts from 'vue3-apexcharts'
-
 import apexEnUs from 'apexcharts/dist/locales/en.json'
 import apexPtBr from 'apexcharts/dist/locales/pt-br.json'
 
@@ -58,7 +56,7 @@ const apexLocales = {
 
 export default {
   components: {
-    ApexChart: VueApexCharts,
+    ApexChart: defineAsyncComponent(() => import('vue3-apexcharts')),
     ChartBarIcon
   },
 
diff --git a/src/components/MonthlyExpenseChart.vue b/src/components/MonthlyExpenseChart.vue
index d7b6719d..e47544e4 100644
--- a/src/components/MonthlyExpenseChart.vue
+++ b/src/components/MonthlyExpenseChart.vue
@@ -35,7 +35,7 @@
 </template>
 
 <script>
-import { computed } from 'vue'
+import { computed, defineAsyncComponent } from 'vue'
 import { useStore } from 'vuex'
 import { useI18n } from 'vue-i18n'
 
@@ -46,8 +46,6 @@ import useMotionSafe from '@/composables/useMotionSafe'
 
 import { ChartBarIcon } from '@heroicons/vue/solid'
 
-import VueApexCharts from 'vue3-apexcharts'
-
 import apexEnUs from 'apexcharts/dist/locales/en.json'
 import apexPtBr from 'apexcharts/dist/locales/pt-br.json'
 
@@ -58,7 +56,7 @@ const apexLocales = {
 
 export default {
   components: {
-    ApexChart: VueApexCharts,
+    ApexChart: defineAsyncComponent(() => import('vue3-apexcharts')),
     ChartBarIcon
   },
 
diff --git a/src/components/PageHeader.vue b/src/components/PageHeader.vue
index c4056b6b..deba977b 100644
--- a/src/components/PageHeader.vue
+++ b/src/components/PageHeader.vue
@@ -1,9 +1,9 @@
 <template>
   <header class="h-16">
-    <div class="max-w-prose mx-auto px-4 sm:px-6 lg:px-0 flex items-center h-full">
+    <div class="max-w-prose mx-auto px-4 sm:px-6 lg:px-0 flex items-center justify-between h-full">
       <router-link
         :to="{ name: 'Home' }"
-        class="flex items-center rounded-md transition-shadow motion-reduce:transition-none focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary-500 dark:focus-visible:ring-offset-gray-900"
+        class="inline-flex shrink-0 items-center rounded-md transition-shadow motion-reduce:transition-none focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary-500 dark:focus-visible:ring-offset-gray-900"
       >
         <span aria-hidden="true">
           <LibraryIcon class="h-9 w-9 text-primary-500" />
@@ -13,22 +13,39 @@
           {{ t('app.name') }}
         </span>
       </router-link>
+      <div class="inline-flex shrink-0">
+        <ThemeToggle light />
+        <router-link
+          :to="{ name: 'DashboardHome' }"
+          class="button is-primary is-rounded ml-3"
+          v-if="signedIn"
+        >
+          {{ t('home.header.dashboard') }}
+        </router-link>
+      </div>
     </div>
   </header>
 </template>
 
 <script>
+import { computed } from 'vue'
+import { useStore } from 'vuex'
 import { useI18n } from 'vue-i18n'
 
 import { LibraryIcon } from '@heroicons/vue/solid'
 
+import ThemeToggle from '@/components/ThemeToggle.vue'
+
 export default {
-  components: { LibraryIcon },
+  components: { LibraryIcon, ThemeToggle },
 
   setup () {
     const { t } = useI18n()
 
-    return { t }
+    const store = useStore()
+    const signedIn = computed(() => store.state.auth.signedIn)
+
+    return { t, signedIn }
   }
 }
 </script>
diff --git a/src/components/StatCard.vue b/src/components/StatCard.vue
index 96120b6e..81f8e467 100644
--- a/src/components/StatCard.vue
+++ b/src/components/StatCard.vue
@@ -34,17 +34,17 @@
     <button
       v-if="sensitive && !alwaysHidden"
       type="button"
-      class="button is-ghost is-darker is-icon-only -mr-2 p-2"
+      class="button is-ghost is-icon-only -mr-2 p-2"
       @click.stop="showValue = !showValue"
     >
       <transition
         mode="out-in"
         leave-active-class="transition motion-reduce:transition-none duration-100 ease-in"
-        leave-from-class="opacity-100"
-        leave-to-class="opacity-0"
+        leave-from-class="opacity-100 rotate-0"
+        leave-to-class="opacity-0 rotate-180"
         enter-active-class="transition motion-reduce:transition-none duration-200 ease-out"
-        enter-from-class="opacity-0"
-        enter-to-class="opacity-100"
+        enter-from-class="opacity-0 -rotate-180"
+        enter-to-class="opacity-100 rotate-0"
       >
         <EyeIcon class="text-gray-500" v-if="!showValue" />
         <EyeOffIcon class="text-gray-500" v-else />
diff --git a/src/components/book/BookCard.vue b/src/components/book/BookCard.vue
index 29def41a..3b662c16 100644
--- a/src/components/book/BookCard.vue
+++ b/src/components/book/BookCard.vue
@@ -70,13 +70,16 @@
         v-if="book.isRead || current || book.isFuture"
         class="badge-wrapper"
       >
-        <template v-if="!current && !book.isFuture">
+        <span v-if="current" class="current-volume">
+          {{ t('book.currentVolume') }}
+        </span>
+        <template v-if="!book.isFuture && book.isRead">
           <span class="sr-only">{{ t('book.read') }}</span>
-          <div class="bg-white dark:bg-primary-50 dark:bg-opacity-95 rounded p-0.5">
+          <div class="bg-white dark:bg-primary-50 dark:bg-opacity-95 rounded p-0.5 self-end ml-auto">
             <BookmarkIcon class="w-5 h-5 text-primary-500" />
           </div>
         </template>
-        <span v-else-if="!current" class="future-item">
+        <span v-else-if="!current && book.isFuture" class="future-item">
           <span aria-hidden="true">
             <ClockIcon class="w-3.5 h-3.5" />
           </span>
@@ -84,9 +87,6 @@
             {{ t('book.future') }}
           </span>
         </span>
-        <span v-else class="current-volume">
-          {{ t('book.currentVolume') }}
-        </span>
       </div>
 
       <div v-if="mode === 'compact'" class="book-gradient text-white absolute top-0 left-0 w-full h-full flex items-start justify-end flex-col pb-2 px-2 lg:pb-3 lg:px-3">
@@ -247,10 +247,9 @@ export default {
 
 .current-volume,
 .future-item {
-  @apply px-1.5 py-px rounded
-    text-xxs uppercase font-bold tracking-wide
-    bg-primary-100 dark:bg-gray-850
-    text-primary-600 dark:text-gray-300;
+  @apply px-1.5 py-0.5 rounded backdrop-blur
+    text-xs font-semibold tracking-wide
+    bg-gray-800/80 text-gray-100;
 }
 
 .future-item {
diff --git a/src/components/book/BookCover.vue b/src/components/book/BookCover.vue
index 065d8541..c02882cd 100644
--- a/src/components/book/BookCover.vue
+++ b/src/components/book/BookCover.vue
@@ -73,12 +73,11 @@
           :class="blurCover ? 'md:filter md:blur-sm md:hover:blur-none motion-safe:transition-all duration-200 ease-in-out' : ''"
           class="max-w-xs md:max-w-full max-h-full shadow-lg rounded"
         >
-        <span
-          v-else
-          aria-hidden="true"
-          :class="(loading || imageLoading) ? 'motion-safe:animate-pulse' : ''"
-        >
-          <BookOpenIcon class="w-12 h-12 text-gray-400 dark:text-gray-600" />
+        <span v-else aria-hidden="true">
+          <BookOpenIcon
+            :class="(loading || imageLoading) ? 'motion-safe:animate-pulse' : ''"
+            class="w-12 h-12 text-gray-500/80 dark:text-gray-400/90"
+          />
         </span>
       </transition>
     </div>
diff --git a/src/components/book/BookInformation.vue b/src/components/book/BookInformation.vue
index dc6816a5..18b4f833 100644
--- a/src/components/book/BookInformation.vue
+++ b/src/components/book/BookInformation.vue
@@ -161,28 +161,7 @@
         <div class="motion-safe:animate-pulse w-64 h-4 bg-gray-400 dark:bg-gray-600 rounded"></div>
       </div>
 
-      <div v-if="showBookInfo && shared" class="owner-badge">
-        <Avatar :picture-url="ownerPictureUrl" small />
-        <div class="owner-info">
-          <span class="owner-title">
-            {{ t('dashboard.sheetChooser.libraryOf') }}
-          </span>
-          <p class="owner-name">
-            {{ ownerDisplayName }}
-          </p>
-        </div>
-        <div
-          class="user-group"
-          :title="t('dashboard.sheetChooser.sharedWithYou')"
-        >
-          <span aria-hidden="true">
-            <UserGroupIcon class="w-5 h-5" />
-          </span>
-          <p class="sr-only">
-            {{ t('dashboard.sheetChooser.sharedWithYou') }}
-          </p>
-        </div>
-      </div>
+      <BookOwnerBadge v-if="showBookInfo" />
 
       <transition
         mode="out-in"
@@ -243,12 +222,12 @@ import {
   BookmarkIcon as BookmarkOutlineIcon,
   ClockIcon,
   StarIcon as StarOutlineIcon,
-  TrashIcon,
-  UserGroupIcon
+  TrashIcon
 } from '@heroicons/vue/outline'
 
 import Avatar from '@/components/Avatar.vue'
 import BookBreadcrumb from '@/components/book/BookBreadcrumb.vue'
+import BookOwnerBadge from '@/components/book/BookOwnerBadge.vue'
 
 import { convertIsbn13ToIsbn10, getIsbnCountry } from '@/util/isbn'
 import getBookLinks from '@/services/links'
@@ -259,6 +238,7 @@ export default {
   components: {
     Avatar,
     BookBreadcrumb,
+    BookOwnerBadge,
     BookmarkOutlineIcon,
     BookmarkSolidIcon,
     ClockIcon,
@@ -267,8 +247,7 @@ export default {
     PencilIcon,
     StarOutlineIcon,
     StarSolidIcon,
-    TrashIcon,
-    UserGroupIcon
+    TrashIcon
   },
 
   props: {
@@ -385,9 +364,6 @@ export default {
     }
 
     const canEdit = computed(() => store.getters['sheet/canEdit'])
-    const ownerDisplayName = computed(() => store.getters['sheet/ownerDisplayName'])
-    const ownerPictureUrl = computed(() => store.getters['sheet/ownerPictureUrl'])
-    const shared = computed(() => store.getters['sheet/shared'])
 
     return {
       showBookInfo,
@@ -405,10 +381,7 @@ export default {
       separator,
       lastSeparator,
       searchByAuthor,
-      canEdit,
-      ownerDisplayName,
-      ownerPictureUrl,
-      shared
+      canEdit
     }
   }
 }
@@ -442,30 +415,6 @@ export default {
     decoration-primary-600 dark:decoration-primary-400;
 }
 
-.owner-badge {
-  @apply flex items-center space-x-3 sm:w-64 rounded-md
-    px-2.5 py-2 border border-gray-200 dark:border-gray-700;
-}
-
-.owner-info {
-  @apply min-w-0 flex-grow;
-}
-
-.owner-title {
-  @apply uppercase text-xxs font-bold tracking-wide block
-    leading-none w-full truncate
-    text-gray-500 dark:text-gray-400;
-}
-
-.owner-name {
-  @apply text-sm font-medium w-full truncate leading-none mt-1
-    text-gray-700 dark:text-gray-300;
-}
-
-.user-group {
-  @apply shrink-0 pr-1 text-gray-400 dark:text-gray-500 ;
-}
-
 .book-external-link {
   @apply flex items-center px-2 py-1
     mr-2 mt-2 space-x-1.5 rounded-full
diff --git a/src/components/book/BookOwnerBadge.vue b/src/components/book/BookOwnerBadge.vue
new file mode 100644
index 00000000..6326f60f
--- /dev/null
+++ b/src/components/book/BookOwnerBadge.vue
@@ -0,0 +1,80 @@
+<template>
+  <div v-if="shared" class="owner-badge">
+    <Avatar :picture-url="ownerPictureUrl" small />
+    <div class="owner-info">
+      <span class="owner-title">
+        {{ t('dashboard.sheetChooser.libraryOf') }}
+      </span>
+      <p class="owner-name">
+        {{ ownerDisplayName }}
+      </p>
+    </div>
+    <div
+      class="user-group"
+      :title="t('dashboard.sheetChooser.sharedWithYou')"
+    >
+      <span aria-hidden="true">
+        <UserGroupIcon class="w-5 h-5" />
+      </span>
+      <p class="sr-only">
+        {{ t('dashboard.sheetChooser.sharedWithYou') }}
+      </p>
+    </div>
+  </div>
+</template>
+
+<script>
+import { computed } from 'vue'
+import { useStore } from 'vuex'
+import { useI18n } from 'vue-i18n'
+
+import { UserGroupIcon } from '@heroicons/vue/solid'
+
+import Avatar from '@/components/Avatar.vue'
+
+export default {
+  components: { Avatar, UserGroupIcon },
+
+  setup () {
+    const { t } = useI18n()
+    const store = useStore()
+
+    const ownerDisplayName = computed(() => store.getters['sheet/ownerDisplayName'])
+    const ownerPictureUrl = computed(() => store.getters['sheet/ownerPictureUrl'])
+    const shared = computed(() => store.getters['sheet/shared'])
+
+    return {
+      t,
+      ownerDisplayName,
+      ownerPictureUrl,
+      shared
+    }
+  }
+}
+</script>
+
+<style lang="postcss" scoped>
+.owner-badge {
+  @apply flex items-center space-x-3 sm:w-64 rounded-md
+    px-2.5 py-2 border border-gray-200 dark:border-gray-700;
+}
+
+.owner-info {
+  @apply min-w-0 flex-grow;
+}
+
+.owner-title {
+  @apply uppercase text-xxs font-bold tracking-wide block
+    leading-none w-full truncate
+    text-gray-500 dark:text-gray-400;
+}
+
+.owner-name {
+  @apply text-sm font-medium w-full truncate leading-none mt-1
+    text-gray-700 dark:text-gray-300;
+}
+
+.user-group {
+  @apply shrink-0 pr-1 text-gray-400 dark:text-gray-500 ;
+}
+</style>
diff --git a/src/components/book/BookProviderSearch.vue b/src/components/book/BookProviderSearch.vue
index 03722ba0..62b61766 100644
--- a/src/components/book/BookProviderSearch.vue
+++ b/src/components/book/BookProviderSearch.vue
@@ -157,10 +157,6 @@ export default {
     const isbnQuery = ref('')
     const searchInput = ref(null)
 
-    function focus (options) {
-      searchInput.value?.focus(options)
-    }
-
     const {
       errorMessage: searchError,
       failed: searchFailed,
@@ -217,7 +213,6 @@ export default {
       t,
       isbnQuery,
       searchInput,
-      focus,
       searchError,
       searchFailed,
       noResultsFound,
diff --git a/src/components/dialogs/BookCreateDialog.vue b/src/components/dialogs/BookCreateDialog.vue
index ae474892..baa752e9 100644
--- a/src/components/dialogs/BookCreateDialog.vue
+++ b/src/components/dialogs/BookCreateDialog.vue
@@ -3,7 +3,7 @@
     <Dialog
       static
       :open="isOpen"
-      :initial-focus="bookProviderSearch"
+      :initial-focus="isbnSearchInput"
       @close="closeDialog"
     >
       <div class="dialog">
@@ -533,6 +533,10 @@ export default {
 
     const bookProviderSearch = ref(null)
 
+    const isbnSearchInput = computed(() => {
+      return bookProviderSearch.value?.$el.querySelector('#book-isbn')
+    })
+
     const store = useStore()
     const ownerPictureUrl = computed(() => store.getters['sheet/ownerPictureUrl'])
     const shared = computed(() => store.getters['sheet/shared'])
@@ -564,6 +568,7 @@ export default {
       bookCreatedId,
       viewBook,
       bookProviderSearch,
+      isbnSearchInput,
       ownerPictureUrl,
       shared,
       ...useRevisionStep(book)
diff --git a/src/composables/useBookDeleter.js b/src/composables/useBookDeleter.js
index 22b5f8b4..395bc28a 100644
--- a/src/composables/useBookDeleter.js
+++ b/src/composables/useBookDeleter.js
@@ -17,7 +17,6 @@ export default function useBookDeleter (book) {
     await SheetService.deleteBook(store.state.sheet.sheetId, book.value)
     await store.dispatch('sheet/loadSheetData', true)
     await store.dispatch('collection/fetchGroups')
-    await store.dispatch('collection/fetchIdMap')
     store.commit(MutationTypes.COLLECTION_UPDATE_LAST_ADDED, { items: [] })
     store.commit(MutationTypes.COLLECTION_UPDATE_LATEST_READINGS, { items: [] })
     store.commit(MutationTypes.COLLECTION_UPDATE_BOOKS, { items: [] })
diff --git a/src/composables/useBookFinder.js b/src/composables/useBookFinder.js
index 4a4682a6..535be3d9 100644
--- a/src/composables/useBookFinder.js
+++ b/src/composables/useBookFinder.js
@@ -7,7 +7,6 @@ export default function useBookFinder () {
   const store = useStore()
 
   const sheetId = computed(() => store.state.sheet.sheetId)
-  const idMap = computed(() => store.state.collection.idMap)
 
   const book = ref(null)
   const bookFound = ref(false)
@@ -21,13 +20,7 @@ export default function useBookFinder () {
     bookFound.value = false
 
     try {
-      if (Object.keys(idMap.value).length === 0) {
-        await store.dispatch('collection/fetchIdMap')
-      }
-
-      const theBook = await SheetService.getBookById(
-        sheetId.value, idMap.value, bookId
-      )
+      const theBook = await SheetService.getBookById(sheetId.value, bookId)
 
       if (!theBook && failCallback) {
         book.value = undefined
@@ -37,7 +30,7 @@ export default function useBookFinder () {
 
       if (theBook.titleParts.number) {
         collection.value = await SheetService.getBooksFromCollection(
-          sheetId.value, idMap.value, theBook
+          sheetId.value, theBook
         )
       }
 
diff --git a/src/composables/useBookInserter.js b/src/composables/useBookInserter.js
index b79ffac0..31386002 100644
--- a/src/composables/useBookInserter.js
+++ b/src/composables/useBookInserter.js
@@ -10,15 +10,10 @@ export default function useBookInserter (book) {
   const inserting = ref(false)
 
   const sheetId = computed(() => store.state.sheet.sheetId)
-  const idMap = computed(() => store.state.collection.idMap)
 
   async function checkIfExists (code) {
     try {
-      if (Object.keys(idMap.value).length === 0) {
-        await store.dispatch('collection/fetchIdMap')
-      }
-
-      const books = await SheetService.getBookByCode(sheetId.value, idMap.value, code)
+      const books = await SheetService.getBookByCode(sheetId.value, code)
 
       if (!books || books.length === 0) {
         return null
@@ -39,7 +34,6 @@ export default function useBookInserter (book) {
     const bookId = await SheetService.insertBook(store.state.sheet.sheetId, bookToInsert)
     await store.dispatch('sheet/loadSheetData', true)
     await store.dispatch('collection/fetchGroups')
-    await store.dispatch('collection/fetchIdMap')
 
     // Also select the new book group so it will be shown in library.
     const groups = store.state.collection.filters.groups
diff --git a/src/composables/useMarkdown.js b/src/composables/useMarkdown.js
index 859f742d..7e6b7a26 100644
--- a/src/composables/useMarkdown.js
+++ b/src/composables/useMarkdown.js
@@ -23,7 +23,7 @@ function youtube (md) {
 
       return dedent`
         <figure>
-          <div class="aspect-w-16 aspect-h-9 bg-gray-50 dark:bg-gray-800 rounded overflow-hidden">
+          <div class="aspect-w-16 aspect-h-9 bg-gray-50 dark:bg-gray-800 rounded-md overflow-hidden shadow-lg">
             <iframe
               src="https://www.youtube-nocookie.com/embed/${type}${id}"
               title="YouTube video player"
diff --git a/src/index.pcss b/src/index.pcss
index 6e077316..8d6e1e32 100644
--- a/src/index.pcss
+++ b/src/index.pcss
@@ -47,7 +47,7 @@
   }
   
   .label {
-    @apply mb-1 block text-sm font-medium 
+    @apply mb-1 block text-sm font-medium select-none
       text-gray-700 dark:text-gray-300;
   }
   
@@ -182,24 +182,25 @@
   }
   
   .button.is-ghost:hover {
-    @apply bg-gray-100 dark:bg-gray-700
-      text-primary-800 dark:text-gray-200
-      dark:border-gray-700;
+    @apply bg-gray-700/10 dark:bg-gray-200/10;
   }
-  
-  .button.is-ghost.is-darker:hover {
-    @apply bg-gray-200 dark:bg-gray-600 dark:border-gray-600;
+
+  .button.is-ghost:active {
+    @apply bg-gray-700/20 dark:bg-gray-200/20;
   }
-  
-  .button.is-ghost.is-darker:active {
-    @apply dark:border-gray-600;
+
+  .button.is-ghost:hover,
+  .button.is-ghost:active {
+    @apply text-primary-800 dark:text-gray-200
+      dark:border-transparent;
   }
   
   .button.is-ghost svg {
     @apply text-primary-500 dark:text-primary-400;
   }
   
-  .button.is-ghost:hover svg {
+  .button.is-ghost:hover svg,
+  .button.is-ghost:active svg {
     @apply text-primary-600 dark:text-gray-200;
   }
   
@@ -336,8 +337,7 @@
   
   .dialog-overlay {
     @apply fixed inset-0 
-      bg-gray-500 dark:bg-gray-900 
-      bg-opacity-75 dark:bg-opacity-90 
+      bg-gray-700/75 dark:bg-gray-900/90
       motion-safe:transition-opacity
       backdrop-filter backdrop-blur-sm;
   }  
diff --git a/src/model/Book.js b/src/model/Book.js
index 194f5b9e..ecbb1830 100644
--- a/src/model/Book.js
+++ b/src/model/Book.js
@@ -13,57 +13,63 @@ import { decimalComma } from '@/util/validators'
 const { n, locale } = i18n.global
 
 export const Columns = {
-  ID: 0,
-  CODE: 1,
-  GROUP: 2,
-  TITLE: 3,
-  AUTHORS: 4,
-  PUBLISHER: 5,
-  DIMENSIONS: 6,
-  STATUS: 7,
-  READ_AT: 8,
-  LABEL_PRICE: 9,
-  PAID_PRICE: 10,
-  STORE: 11,
-  COVER_URL: 12,
-  BOUGHT_AT: 13,
-  FAVORITE: 14,
-  SYNOPSIS: 15,
-  NOTES: 16,
-  TAGS: 17,
-  CREATED_AT: 18,
-  UPDATED_AT: 19
+  ROW: 0,
+  ID: 1,
+  CODE: 2,
+  GROUP: 3,
+  TITLE: 4,
+  AUTHORS: 5,
+  PUBLISHER: 6,
+  DIMENSIONS: 7,
+  STATUS: 8,
+  READ_AT: 9,
+  LABEL_PRICE_CURRENCY: 10,
+  LABEL_PRICE_VALUE: 11,
+  PAID_PRICE_CURRENCY: 12,
+  PAID_PRICE_VALUE: 13,
+  STORE: 14,
+  COVER_URL: 15,
+  BOUGHT_AT: 16,
+  FAVORITE: 17,
+  SYNOPSIS: 18,
+  NOTES: 19,
+  TAGS: 20,
+  CREATED_AT: 21,
+  UPDATED_AT: 22
 }
 
 export const CollectionColumns = {
-  ID: 'B',
-  CODE: 'C',
-  GROUP: 'D',
-  TITLE: 'E',
-  AUTHORS: 'F',
-  PUBLISHER: 'G',
-  DIMENSIONS: 'H',
-  STATUS: 'I',
-  READ_AT: 'J',
-  LABEL_PRICE: 'K',
-  PAID_PRICE: 'L',
-  STORE: 'M',
-  COVER_URL: 'N',
-  BOUGHT_AT: 'O',
-  FAVORITE: 'P',
-  SYNOPSIS: 'Q',
-  NOTES: 'R',
-  TAGS: 'S',
-  CREATED_AT: 'T',
-  UPDATED_AT: 'U'
+  ROW: 'B',
+  ID: 'C',
+  CODE: 'D',
+  GROUP: 'E',
+  TITLE: 'F',
+  AUTHORS: 'G',
+  PUBLISHER: 'H',
+  DIMENSIONS: 'I',
+  STATUS: 'J',
+  READ_AT: 'K',
+  LABEL_PRICE_CURRENCY: 'L',
+  LABEL_PRICE_VALUE: 'M',
+  PAID_PRICE_CURRENCY: 'N',
+  PAID_PRICE_VALUE: 'O',
+  STORE: 'P',
+  COVER_URL: 'Q',
+  BOUGHT_AT: 'R',
+  FAVORITE: 'S',
+  SYNOPSIS: 'T',
+  NOTES: 'U',
+  TAGS: 'V',
+  CREATED_AT: 'W',
+  UPDATED_AT: 'X'
 }
 
 export const PropertyToColumn = {
   title: CollectionColumns.TITLE,
   publisher: CollectionColumns.PUBLISHER,
   status: CollectionColumns.STATUS,
-  'paidPrice.value': CollectionColumns.PAID_PRICE,
-  'labelPrice.value': CollectionColumns.LABEL_PRICE,
+  'paidPrice.value': CollectionColumns.PAID_PRICE_VALUE,
+  'labelPrice.value': CollectionColumns.LABEL_PRICE_VALUE,
   boughtAt: CollectionColumns.BOUGHT_AT,
   readAt: CollectionColumns.READ_AT,
   createdAt: CollectionColumns.CREATED_AT,
@@ -87,6 +93,9 @@ export default class Book {
   /** @type {?string} */
   sheetLocation = null
 
+  /** @type {?number} */
+  row = -1
+
   /** @type {?string} */
   id = null
 
@@ -307,6 +316,7 @@ export default class Book {
     const offset = now.getTimezoneOffset()
 
     return [
+      '=ROW()',
       this.id || nanoid(),
       this.code,
       this.group,
@@ -317,10 +327,10 @@ export default class Book {
         ' × ' + n(this.dimensions.height, 'dimensions', 'en-US'),
       this.status || STATUS_UNREAD,
       this.readAt ? formatDateToSheet(fixDate(this.readAt, offset)) : '',
-      this.labelPrice.currency + ' ' +
-        n(this.labelPrice.value, 'decimal', 'en-US'),
-      this.paidPrice.currency + ' ' +
-        n(this.paidPrice.value, 'decimal', 'en-US'),
+      this.labelPrice.currency,
+      n(this.labelPrice.value, 'decimal', 'en-US'),
+      this.paidPrice.currency,
+      n(this.paidPrice.value, 'decimal', 'en-US'),
       this.store,
       this.coverUrl || '',
       this.boughtAt ? formatDateToSheet(fixDate(this.boughtAt, offset)) : '',
@@ -338,19 +348,18 @@ export default class Book {
    *
    * @returns {Book}
    */
-  static fromDataTable (dataTable, idMap, i) {
+  static fromDataTable (dataTable, i) {
     function getProperty (column) {
       return dataTable.getValue(i, column)
     }
 
-    const id = getProperty(Columns.ID)
-    const labelPrice = getProperty(Columns.LABEL_PRICE).split(' ')
-    const paidPrice = getProperty(Columns.PAID_PRICE).split(' ')
+    const row = getProperty(Columns.ROW)
     const dimensions = getProperty(Columns.DIMENSIONS).split(' × ')
 
     return new Book({
-      sheetLocation: `Collection!B${idMap[id]}`,
-      id,
+      sheetLocation: `Collection!B${row}`,
+      row,
+      id: getProperty(Columns.ID),
       code: getProperty(Columns.CODE),
       group: getProperty(Columns.GROUP),
       title: getProperty(Columns.TITLE),
@@ -363,12 +372,12 @@ export default class Book {
       status: getProperty(Columns.STATUS),
       readAt: getProperty(Columns.READ_AT),
       labelPrice: {
-        currency: labelPrice[0],
-        value: labelPrice[1] ? parseFloat(labelPrice[1]) : 0.0
+        currency: getProperty(Columns.LABEL_PRICE_CURRENCY),
+        value: getProperty(Columns.LABEL_PRICE_VALUE)
       },
       paidPrice: {
-        currency: paidPrice[0],
-        value: paidPrice[1] ? parseFloat(paidPrice[1]) : 0.0
+        currency: getProperty(Columns.PAID_PRICE_CURRENCY),
+        value: getProperty(Columns.PAID_PRICE_VALUE)
       },
       store: getProperty(Columns.STORE),
       coverUrl: getProperty(Columns.COVER_URL) || '',
diff --git a/src/services/sheet/buildSheetUrl.js b/src/services/sheet/buildSheetUrl.js
index f719ff54..bfd814ae 100644
--- a/src/services/sheet/buildSheetUrl.js
+++ b/src/services/sheet/buildSheetUrl.js
@@ -1,4 +1,4 @@
-const COLLECTION_RANGE = 'B4:U'
+const COLLECTION_RANGE = 'B4:X'
 const COLLECTION_SHEET = 'Collection'
 
 export default function buildSheetUrl (sheetId) {
diff --git a/src/services/sheet/getBookByCode.js b/src/services/sheet/getBookByCode.js
index 93727273..4bc6f826 100644
--- a/src/services/sheet/getBookByCode.js
+++ b/src/services/sheet/getBookByCode.js
@@ -6,7 +6,7 @@ import buildSheetUrl from './buildSheetUrl'
 
 import Book, { CollectionColumns } from '@/model/Book'
 
-export default function getBookByCode (sheetId, idMap, code) {
+export default function getBookByCode (sheetId, code) {
   const sheetUrl = buildSheetUrl(sheetId)
 
   const query = new window.google.visualization.Query(sheetUrl)
@@ -36,7 +36,7 @@ export default function getBookByCode (sheetId, idMap, code) {
       const books = []
 
       for (let i = 0; i < rows; i++) {
-        books.push(Book.fromDataTable(dataTable, idMap, i))
+        books.push(Book.fromDataTable(dataTable, i))
       }
 
       resolve(books)
diff --git a/src/services/sheet/getBookById.js b/src/services/sheet/getBookById.js
index bdf8ed1d..1456c037 100644
--- a/src/services/sheet/getBookById.js
+++ b/src/services/sheet/getBookById.js
@@ -6,7 +6,7 @@ import buildSheetUrl from './buildSheetUrl'
 
 import Book, { CollectionColumns } from '@/model/Book'
 
-export default function getBookById (sheetId, idMap, id) {
+export default function getBookById (sheetId, id) {
   const sheetUrl = buildSheetUrl(sheetId)
 
   const query = new window.google.visualization.Query(sheetUrl)
@@ -34,7 +34,7 @@ export default function getBookById (sheetId, idMap, id) {
         return
       }
 
-      resolve(Book.fromDataTable(dataTable, idMap, 0))
+      resolve(Book.fromDataTable(dataTable, 0))
     })
   })
 }
diff --git a/src/services/sheet/getBookIds.js b/src/services/sheet/getBookIds.js
deleted file mode 100644
index 284cb1f6..00000000
--- a/src/services/sheet/getBookIds.js
+++ /dev/null
@@ -1,45 +0,0 @@
-import dedent from 'dedent'
-
-import i18n from '@/i18n'
-
-import buildSheetUrl from './buildSheetUrl'
-
-import { CollectionColumns } from '@/model/Book'
-
-export default function getBookIds (sheetId) {
-  const sheetUrl = buildSheetUrl(sheetId)
-
-  const query = new window.google.visualization.Query(sheetUrl)
-  query.setQuery(dedent`
-    select ${CollectionColumns.ID}
-  `)
-
-  return new Promise((resolve, reject) => {
-    query.send(response => {
-      if (response.isError()) {
-        const message = i18n.global.t('errors.badQuery', { error: response.getMessage() })
-        reject(new Error(message))
-
-        return
-      }
-
-      const dataTable = response.getDataTable()
-
-      const rows = dataTable.getNumberOfRows()
-
-      if (rows === 0) {
-        resolve({})
-        return
-      }
-
-      const ids = {}
-
-      for (let i = 0; i < rows; i++) {
-        const id = dataTable.getValue(i, 0)
-        ids[id] = i + 5
-      }
-
-      resolve(ids)
-    })
-  })
-}
diff --git a/src/services/sheet/getBookNeighbors.js b/src/services/sheet/getBookNeighbors.js
index 721d2e9b..7b8134de 100644
--- a/src/services/sheet/getBookNeighbors.js
+++ b/src/services/sheet/getBookNeighbors.js
@@ -6,7 +6,7 @@ import buildSheetUrl from './buildSheetUrl'
 
 import Book, { CollectionColumns, Columns } from '@/model/Book'
 
-export default function getBookNeighbors (sheetId, idMap, book) {
+export default function getBookNeighbors (sheetId, book) {
   const sheetUrl = buildSheetUrl(sheetId)
 
   const query = new window.google.visualization.Query(sheetUrl)
@@ -46,11 +46,11 @@ export default function getBookNeighbors (sheetId, idMap, book) {
       }
 
       const previous = bookRow > 0
-        ? Book.fromDataTable(dataTable, idMap, bookRow - 1)
+        ? Book.fromDataTable(dataTable, bookRow - 1)
         : null
 
       const next = bookRow < rows - 1
-        ? Book.fromDataTable(dataTable, idMap, bookRow + 1)
+        ? Book.fromDataTable(dataTable, bookRow + 1)
         : null
 
       resolve({ previous, next })
diff --git a/src/services/sheet/getBooks.js b/src/services/sheet/getBooks.js
index 3820a90d..53313b1c 100644
--- a/src/services/sheet/getBooks.js
+++ b/src/services/sheet/getBooks.js
@@ -8,7 +8,7 @@ import { PER_PAGE } from './constants'
 
 import Book, { CollectionColumns, STATUS_FUTURE } from '@/model/Book'
 
-export default async function getBooks (sheetId, idMap, page = 1, options = {}) {
+export default async function getBooks (sheetId, page = 1, options = {}) {
   const sheetUrl = buildSheetUrl(sheetId)
 
   const offset = (page - 1) * PER_PAGE
@@ -16,6 +16,18 @@ export default async function getBooks (sheetId, idMap, page = 1, options = {})
   const orderDirection = options.orderDirection || 'desc'
   const limit = options.limit || PER_PAGE
 
+  let orderByStr = `${orderBy} ${orderDirection}`
+
+  if (
+    orderBy === CollectionColumns.LABEL_PRICE_VALUE ||
+    orderBy === CollectionColumns.PAID_PRICE_VALUE
+  ) {
+    const currencyColumn = orderBy === CollectionColumns.LABEL_PRICE_VALUE
+      ? CollectionColumns.LABEL_PRICE_CURRENCY
+      : CollectionColumns.PAID_PRICE_CURRENCY
+    orderByStr = `${currencyColumn} asc, ${orderByStr}`
+  }
+
   const conditions = []
 
   if (options.groups) {
@@ -37,7 +49,7 @@ export default async function getBooks (sheetId, idMap, page = 1, options = {})
 
   const queryStr = dedent`
     select * ${where}
-    order by ${orderBy} ${orderDirection}
+    order by ${orderByStr}
     limit ${limit} offset ${offset}
   `
 
@@ -63,7 +75,7 @@ export default async function getBooks (sheetId, idMap, page = 1, options = {})
       const books = []
 
       for (let i = 0; i < rows; i++) {
-        books.push(Book.fromDataTable(dataTable, idMap, i))
+        books.push(Book.fromDataTable(dataTable, i))
       }
 
       resolve({ books, totalResults })
diff --git a/src/services/sheet/getBooksFromCollection.js b/src/services/sheet/getBooksFromCollection.js
index 132d2fdd..321dbea2 100644
--- a/src/services/sheet/getBooksFromCollection.js
+++ b/src/services/sheet/getBooksFromCollection.js
@@ -6,7 +6,7 @@ import buildSheetUrl from './buildSheetUrl'
 
 import Book, { CollectionColumns } from '@/model/Book'
 
-export default function getBooksFromCollection (sheetId, idMap, book) {
+export default function getBooksFromCollection (sheetId, book) {
   const sheetUrl = buildSheetUrl(sheetId)
 
   const query = new window.google.visualization.Query(sheetUrl)
@@ -37,7 +37,7 @@ export default function getBooksFromCollection (sheetId, idMap, book) {
       }
 
       for (let i = 0; i < rows; i++) {
-        books.push(Book.fromDataTable(dataTable, idMap, i))
+        books.push(Book.fromDataTable(dataTable, i))
       }
 
       resolve(books)
diff --git a/src/services/sheet/getBooksFromGroup.js b/src/services/sheet/getBooksFromGroup.js
index 5cefa7bd..b2045fca 100644
--- a/src/services/sheet/getBooksFromGroup.js
+++ b/src/services/sheet/getBooksFromGroup.js
@@ -1,5 +1,5 @@
 import getBooks from './getBooks'
 
-export default function getBooksFromGroup (sheetId, idMap, group, page = 1, options = {}) {
-  return getBooks(sheetId, idMap, page, { ...options, group })
+export default function getBooksFromGroup (sheetId, group, page = 1, options = {}) {
+  return getBooks(sheetId, page, { ...options, group })
 }
diff --git a/src/services/sheet/getLatestReadings.js b/src/services/sheet/getLatestReadings.js
index 83bdd3c7..4c4ccf55 100644
--- a/src/services/sheet/getLatestReadings.js
+++ b/src/services/sheet/getLatestReadings.js
@@ -7,7 +7,7 @@ import { PER_PAGE } from './constants'
 
 import Book, { CollectionColumns, STATUS_READ } from '@/model/Book'
 
-export default async function getLatestReadings (sheetId, idMap, options = {}) {
+export default async function getLatestReadings (sheetId, options = {}) {
   const sheetUrl = buildSheetUrl(sheetId)
 
   const limit = options.limit || PER_PAGE
@@ -37,7 +37,7 @@ export default async function getLatestReadings (sheetId, idMap, options = {}) {
       const books = []
 
       for (let i = 0; i < rows; i++) {
-        books.push(Book.fromDataTable(dataTable, idMap, i))
+        books.push(Book.fromDataTable(dataTable, i))
       }
 
       resolve(books)
diff --git a/src/services/sheet/index.js b/src/services/sheet/index.js
index 8f2a5574..1dde643a 100644
--- a/src/services/sheet/index.js
+++ b/src/services/sheet/index.js
@@ -4,7 +4,6 @@ import deleteBook from './deleteBook'
 import findSheetId from './findSheetId'
 import getBookByCode from './getBookByCode'
 import getBookById from './getBookById'
-import getBookIds from './getBookIds'
 import getBookNeighbors from './getBookNeighbors'
 import getBooks from './getBooks'
 import getBooksFromCollection from './getBooksFromCollection'
@@ -26,7 +25,6 @@ export default {
   findSheetId,
   getBookByCode,
   getBookById,
-  getBookIds,
   getBookNeighbors,
   getBooks,
   getBooksFromCollection,
diff --git a/src/services/sheet/searchBooks.js b/src/services/sheet/searchBooks.js
index 55427a30..bcb731a5 100644
--- a/src/services/sheet/searchBooks.js
+++ b/src/services/sheet/searchBooks.js
@@ -125,7 +125,7 @@ export function createSearchKeywords () {
   }
 }
 
-export default async function searchBooks ({ sheetId, idMap, searchTerm, sort, page = 1 }) {
+export default async function searchBooks ({ sheetId, searchTerm, sort, page = 1 }) {
   const sheetUrl = buildSheetUrl(sheetId)
 
   let searchQueryObj = searchTerm
@@ -291,7 +291,7 @@ export default async function searchBooks ({ sheetId, idMap, searchTerm, sort, p
       const books = []
 
       for (let i = 0; i < rows; i++) {
-        books.push(Book.fromDataTable(dataTable, idMap, i))
+        books.push(Book.fromDataTable(dataTable, i))
       }
 
       resolve({ results: books, total: totalResults })
diff --git a/src/store/modules/collection.js b/src/store/modules/collection.js
index 274eed83..7ffa8911 100644
--- a/src/store/modules/collection.js
+++ b/src/store/modules/collection.js
@@ -16,7 +16,6 @@ export const CollectionMutations = {
   UPDATE_CURRENT_PAGE: 'updateCurrentPage',
   UPDATE_FUTURE_ITEMS: 'updateFutureItems',
   UPDATE_GROUPS: 'updateGroups',
-  UPDATE_ID_MAP: 'updateIdMap',
   UPDATE_PUBLISHERS: 'updatePublishers',
   UPDATE_LAST_ADDED: 'updateLastAdded',
   UPDATE_LATEST_READINGS: 'updateLatestReadings',
@@ -60,7 +59,6 @@ const state = () => ({
     }
   },
   futureItems: FUTURE_HIDE,
-  idMap: {},
   links: 6,
   paginationInfo: {},
   perPage: 18,
@@ -80,10 +78,6 @@ const actions = {
         await dispatch('fetchGroups')
       }
 
-      if (Object.keys(state.idMap).length === 0) {
-        await dispatch('fetchIdMap')
-      }
-
       let groups = state.filters.groups.selected
       const allGroups = state.filters.groups.items.map(grp => grp.name)
       const groupData = groups.filter(grp => allGroups.includes(grp))
@@ -98,7 +92,7 @@ const actions = {
       const orderDirection = state.sortDirection
       const futureItems = state.futureItems
 
-      const { books, totalResults } = await SheetService.getBooks(sheetId, state.idMap, page, {
+      const { books, totalResults } = await SheetService.getBooks(sheetId, page, {
         futureItems,
         groups,
         orderBy,
@@ -125,17 +119,6 @@ const actions = {
     }
   },
 
-  async fetchIdMap ({ commit, rootState }) {
-    const sheetId = rootState.sheet.sheetId
-
-    try {
-      const idMap = await SheetService.getBookIds(sheetId)
-      commit(CollectionMutations.UPDATE_ID_MAP, idMap)
-    } catch (e) {
-      commit(CollectionMutations.UPDATE_ID_MAP, {})
-    }
-  },
-
   async fetchPublishers ({ commit, rootState }) {
     commit(CollectionMutations.UPDATE_PUBLISHERS, { loading: true, items: [] })
 
@@ -155,11 +138,7 @@ const actions = {
     const sheetId = rootState.sheet.sheetId
 
     try {
-      if (Object.keys(state.idMap).length === 0) {
-        await dispatch('fetchIdMap')
-      }
-
-      const lastAdded = await SheetService.getBooks(sheetId, state.idMap, 1, {
+      const lastAdded = await SheetService.getBooks(sheetId, 1, {
         limit: 6,
         dontCount: true
       })
@@ -175,11 +154,7 @@ const actions = {
     const sheetId = rootState.sheet.sheetId
 
     try {
-      if (Object.keys(state.idMap).length === 0) {
-        await dispatch('fetchIdMap')
-      }
-
-      const latestReadings = await SheetService.getLatestReadings(sheetId, state.idMap, {
+      const latestReadings = await SheetService.getLatestReadings(sheetId, {
         limit: 6
       })
       commit(CollectionMutations.UPDATE_LATEST_READINGS, { items: latestReadings })
@@ -207,7 +182,6 @@ const actions = {
     commit(CollectionMutations.UPDATE_PUBLISHERS, { items: [] })
     commit(CollectionMutations.UPDATE_STORES, { items: [] })
 
-    await dispatch('fetchIdMap')
     await dispatch('fetchGroups')
     await dispatch('fetchBooks')
     await dispatch('fetchLastAdded')
@@ -253,11 +227,6 @@ const mutations = {
     }
   },
 
-  [CollectionMutations.UPDATE_ID_MAP]: function (state, idMap) {
-    state.idMap = {}
-    state.idMap = { ...state.idMap, ...idMap }
-  },
-
   [CollectionMutations.UPDATE_PUBLISHERS]: function (state, publishers) {
     state.filters.publishers = { ...state.filters.publishers, ...publishers }
   },
diff --git a/src/store/modules/search.js b/src/store/modules/search.js
index 4bb26a53..3b91ee76 100644
--- a/src/store/modules/search.js
+++ b/src/store/modules/search.js
@@ -38,10 +38,6 @@ const actions = {
     const sheetId = rootState.sheet.sheetId
 
     try {
-      if (Object.keys(rootState.collection.idMap).length === 0) {
-        await dispatch('collection/fetchIdMap', null, { root: true })
-      }
-
       commit(SearchMutations.UPDATE_STATE, {
         sortBy: sortBy || state.sortBy,
         sortDirection: sortDirection || state.sortDirection
@@ -49,7 +45,6 @@ const actions = {
 
       const { results, total } = await SheetService.searchBooks({
         sheetId,
-        idMap: rootState.collection.idMap,
         searchTerm: query,
         sort: {
           sortBy: state.sortBy,
diff --git a/src/views/Home.vue b/src/views/Home.vue
index 738e32b9..905d0b0a 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -201,12 +201,13 @@ export default {
 
 .functionality-description .icon,
 .feature .icon {
-  @apply w-12 h-12 bg-primary-500 inline-flex justify-center items-center rounded-md;
+  @apply w-12 h-12 inline-flex justify-center items-center rounded-md
+    bg-primary-100 dark:bg-gray-700;
 }
 
 .functionality-description .icon svg,
 .feature .icon svg {
-  @apply w-6 h-6 text-white;
+  @apply w-6 h-6 text-primary-600 dark:text-gray-400;
 }
 
 .functionality {
@@ -250,10 +251,15 @@ export default {
 }
 
 .cta .button {
-  @apply py-3 px-5 font-medium text-base shadow-md justify-center;
+  @apply py-3 px-5 font-medium text-base shadow-md justify-center
+    motion-safe:transition-transform;
 }
 
 .cta .button.is-secondary {
   @apply text-primary-500 dark:text-gray-100;
 }
+
+.cta .button:hover {
+  @apply -translate-y-0.5;
+}
 </style>
diff --git a/src/views/dashboard/Stats.vue b/src/views/dashboard/Stats.vue
index 446b33f6..0c25017e 100644
--- a/src/views/dashboard/Stats.vue
+++ b/src/views/dashboard/Stats.vue
@@ -84,7 +84,6 @@ import { useStore } from 'vuex'
 import { useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
 
-import { DotsHorizontalIcon, PlusIcon } from '@heroicons/vue/solid'
 import {
   ExclamationCircleIcon,
   PresentationChartLineIcon
@@ -103,9 +102,7 @@ export default {
     MonthlyBoughtsChart,
     MonthlyExpenseChart,
     SimpleHeader,
-    DotsHorizontalIcon,
     ExclamationCircleIcon,
-    PlusIcon,
     PresentationChartLineIcon
   },
 
diff --git a/tailwind.config.js b/tailwind.config.js
index f1ac5952..31608cd5 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -29,7 +29,7 @@ module.exports = {
         current: 'currentColor'
       },
       fontSize: {
-        'xxs': '.7rem'
+        xxs: '.7rem'
       },
       height: {
         's-40': '40vh',