diff --git a/app/views/layouts/tailwind.html.erb b/app/views/layouts/tailwind.html.erb
index 30dbe167..5ea55172 100644
--- a/app/views/layouts/tailwind.html.erb
+++ b/app/views/layouts/tailwind.html.erb
@@ -25,7 +25,7 @@
 
   <!-- navbar -->
   <header class="flex sticky top-0 z-50 w-full bg-notebook-blue border-b border-blue-400 h-14 shadow">
-    <%= link_to root_path, class: 'flex items-center mr-2 px-6 py-4 border-b border-gray-300 shadow hover:shadow-lg transition bg-white rounded-br-lg' do %>
+    <%= link_to root_path, class: 'flex items-center mr-2 px-6 py-4 border-b border-gray-300 shadow hover:shadow-md transition bg-white rounded-br-lg' do %>
       <%= image_tag 'logos/book-small.webp', class: 'h-8 mr-3' %>
       <span class="text-2xl font-bold text-notebook-blue tracking-wide">
         Notebook.ai
@@ -160,11 +160,11 @@
   </header>
 
   <!-- sidebar -->
-  <nav x-show="showSidebar" class="fixed top-0 pt-16 flex flex-col left-0 z-20 h-screen overflow-x-hidden transition origin-left transform bg-white border-r w-60 md:translate-x-0" :class="{ '-translate-x-full' : !showSidebar, 'translate-x-0' : showSidebar }" <%# @click.away="showSidebar = false" %>>
-    <nav class="text-sm font-medium text-gray-600 overflow-y-auto flex-grow border-b border-gray-300 shadow" aria-label="Main Navigation">
+  <nav x-show="showSidebar" class="fixed top-0 pt-16 flex flex-col left-0 z-20 h-screen overflow-x-hidden transition origin-left transform bg-white border-r w-56 md:translate-x-0" :class="{ '-translate-x-full' : !showSidebar, 'translate-x-0' : showSidebar }" <%# @click.away="showSidebar = false" %>>
+    <nav class="text-sm font-medium text-gray-600 pt-1 overflow-y-auto flex-grow border-b border-gray-300 shadow" aria-label="Main Navigation">
       <%= link_to table_of_contents_path, class: 'flex items-center px-2 py-3 transition cursor-pointer group hover:bg-gray-100' do %>
         <i class="material-icons text-gray-400 shrink-0 w-6 h-6 mr-2 <%= Universe.text_color %>">dashboard</i>
-        <span class="group-hover:text-gray-900">Table of Contents</span> 
+        <span class="group-hover:text-gray-900">Table of Contents</span>
       <% end %>
 
       <div x-data="{ expandedWorldbuildingSidebar: false }">
@@ -284,7 +284,7 @@
   <div class="fixed inset-0 z-10 w-screen h-screen bg-black bg-opacity-25 md:hidden" x-show.transition="showSidebar" x-cloak></div>
 
   <!-- main content -->
-  <main :class="{ 'ml-60': showSidebar }">
+  <main :class="{ 'ml-56': showSidebar }">
     <%= yield %>
   </main>