diff --git a/public/styles/layout.css b/public/styles/layout.css
index 8b75702..f1fcaa8 100755
--- a/public/styles/layout.css
+++ b/public/styles/layout.css
@@ -144,6 +144,11 @@
   z-index: var(--z-nav);
   backdrop-filter: var(--blur-md) saturate(180%);
   -webkit-backdrop-filter: var(--blur-md) saturate(180%);
+  transition: transform 0.2s var(--ease-out);
+}
+
+.nav-bottom--hidden {
+  transform: translateY(100%);
 }
 
 /* ── Items-Reihe ── */
@@ -197,7 +202,7 @@
   padding: var(--space-4) var(--space-4) calc(var(--space-4) + var(--safe-area-inset-bottom));
   z-index: calc(var(--z-nav) + 2);
   display: grid;
-  grid-template-columns: repeat(4, 1fr);
+  grid-template-columns: repeat(3, 1fr);
   gap: var(--space-3);
   transform: translateY(100%);
   transition: transform 0.25s var(--ease-out);
@@ -1590,6 +1595,14 @@
   width: min(calc(100% - var(--space-8)), 380px);
 }
 
+@media (min-width: 768px) and (max-width: 1023px) {
+  .toast-container {
+    bottom: var(--space-8);
+    left: 50%;
+    transform: translateX(-50%);
+  }
+}
+
 @media (min-width: 1024px) {
   .toast-container {
     bottom: var(--space-6);