diff --git a/app/build.gradle b/app/build.gradle
index 99d9dac..df24a64 100644
--- a/app/build.gradle
+++ b/app/build.gradle
@@ -105,9 +105,10 @@ dependencies {
     kapt "com.google.dagger:hilt-compiler:2.40.5"
 
     // Accompanist
-    implementation "com.google.accompanist:accompanist-systemuicontroller:0.24.3-alpha"
-    implementation "com.google.accompanist:accompanist-insets:0.24.3-alpha"
-    implementation "com.google.accompanist:accompanist-drawablepainter:0.24.3-alpha"
+    implementation "com.google.accompanist:accompanist-systemuicontroller:0.24.7-alpha"
+    implementation "com.google.accompanist:accompanist-insets:0.24.7-alpha"
+    implementation "com.google.accompanist:accompanist-drawablepainter:0.24.7-alpha"
+    implementation "com.google.accompanist:accompanist-navigation-material:0.24.7-alpha"
 
     // Navigation
     implementation "androidx.navigation:navigation-compose:2.4.2"
diff --git a/app/src/main/java/com/pixelized/biblib/ui/MainActivity.kt b/app/src/main/java/com/pixelized/biblib/ui/MainActivity.kt
index c86a8e5..808915d 100644
--- a/app/src/main/java/com/pixelized/biblib/ui/MainActivity.kt
+++ b/app/src/main/java/com/pixelized/biblib/ui/MainActivity.kt
@@ -10,6 +10,7 @@ import androidx.compose.material.Surface
 import androidx.core.splashscreen.SplashScreen.Companion.installSplashScreen
 import androidx.core.view.WindowCompat
 import com.google.accompanist.insets.ProvideWindowInsets
+import com.google.accompanist.navigation.material.ExperimentalMaterialNavigationApi
 import com.google.accompanist.systemuicontroller.SystemUiController
 import com.google.accompanist.systemuicontroller.rememberSystemUiController
 import com.pixelized.biblib.ui.composable.SystemThemeColor
@@ -24,6 +25,7 @@ class MainActivity : ComponentActivity() {
 
     private val launcherViewModel: LauncherViewModel by viewModels()
 
+    @OptIn(ExperimentalMaterialNavigationApi::class)
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
 
diff --git a/app/src/main/java/com/pixelized/biblib/ui/navigation/screen/ScreenNavHost.kt b/app/src/main/java/com/pixelized/biblib/ui/navigation/screen/ScreenNavHost.kt
index fea4683..629698f 100644
--- a/app/src/main/java/com/pixelized/biblib/ui/navigation/screen/ScreenNavHost.kt
+++ b/app/src/main/java/com/pixelized/biblib/ui/navigation/screen/ScreenNavHost.kt
@@ -8,6 +8,7 @@ import androidx.navigation.NavHostController
 import androidx.navigation.compose.NavHost
 import androidx.navigation.compose.composable
 import androidx.navigation.compose.rememberNavController
+import com.google.accompanist.navigation.material.*
 import com.pixelized.biblib.ui.screen.authentication.AuthenticationScreen
 import com.pixelized.biblib.ui.screen.detail.DetailScreen
 import com.pixelized.biblib.ui.screen.home.HomeScreen
@@ -16,29 +17,33 @@ val LocalScreenNavHostController = compositionLocalOf<NavHostController> {
     error("LocalFullScreenNavHostController is not ready yet.")
 }
 
+@OptIn(ExperimentalMaterialNavigationApi::class)
 @Composable
 fun ScreenNavHost(
     modifier: Modifier = Modifier,
-    navHostController: NavHostController = rememberNavController(),
+    bottomSheetNavigator: BottomSheetNavigator = rememberBottomSheetNavigator(),
+    navHostController: NavHostController = rememberNavController(bottomSheetNavigator),
     startDestination: Screen = Screen.Authentication
 ) {
     CompositionLocalProvider(LocalScreenNavHostController provides navHostController) {
-        NavHost(
-            modifier = modifier,
-            navController = navHostController,
-            startDestination = startDestination.route,
-        ) {
-            composable(Screen.Authentication.route) {
-                AuthenticationScreen()
-            }
-            composable(Screen.Home.route) {
-                HomeScreen()
-            }
-            composable(
-                route = Screen.BookDetail.route,
-                arguments = Screen.BookDetail.arguments,
+        ModalBottomSheetLayout(bottomSheetNavigator) {
+            NavHost(
+                modifier = modifier,
+                navController = navHostController,
+                startDestination = startDestination.route,
             ) {
-                DetailScreen()
+                composable(Screen.Authentication.route) {
+                    AuthenticationScreen()
+                }
+                composable(Screen.Home.route) {
+                    HomeScreen()
+                }
+                bottomSheet(
+                    route = Screen.BookDetail.route,
+                    arguments = Screen.BookDetail.arguments,
+                ) {
+                    DetailScreen()
+                }
             }
         }
     }
diff --git a/app/src/main/java/com/pixelized/biblib/ui/screen/detail/DetailScreen.kt b/app/src/main/java/com/pixelized/biblib/ui/screen/detail/DetailScreen.kt
index 6704875..16ecb7a 100644
--- a/app/src/main/java/com/pixelized/biblib/ui/screen/detail/DetailScreen.kt
+++ b/app/src/main/java/com/pixelized/biblib/ui/screen/detail/DetailScreen.kt
@@ -59,13 +59,12 @@ private fun DetailScreenContent(
                 .systemBarsPadding()
                 .padding(horizontal = 16.dp)
         ) {
-
             AnimatedOffset(
                 modifier = Modifier
                     .padding(16.dp)
                     .align(Alignment.CenterHorizontally),
             ) {
-                Card(
+                Box(
                     modifier = Modifier
                         .size(200.dp, 320.dp)
                         .background(MaterialTheme.colors.surface),