diff --git a/projects/demo/src/app/app.scss b/projects/demo/src/app/app.scss
index 9d06cf0..7c8abf8 100644
--- a/projects/demo/src/app/app.scss
+++ b/projects/demo/src/app/app.scss
@@ -4,6 +4,9 @@
 }
 
 .demo-toolbar {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
   position: sticky;
   top: 0;
   z-index: 10;
@@ -19,10 +22,12 @@
 
 .demo-toolbar__title {
   font: var(--mat-sys-title-medium);
+  min-width: 0;
 }
 
 .demo-toolbar__spacer {
-  flex: 1;
+  flex: 1 1 auto;
+  min-width: 0;
 }
 
 .theme-controls {
@@ -30,6 +35,7 @@
   flex-wrap: wrap;
   align-items: center;
   gap: 1rem 1.25rem;
+  min-width: 0;
 }
 
 .theme-controls__color {
@@ -37,6 +43,7 @@
   align-items: center;
   gap: 0.5rem;
   cursor: pointer;
+  min-width: 0;
 }
 
 .theme-controls__label {
@@ -103,7 +110,7 @@
   color: var(--mat-sys-primary);
 }
 
-@media (max-width: 720px) {
+@media (max-width: 850px) {
   .demo-toolbar__title {
     display: none;
   }
@@ -112,3 +119,9 @@
     display: none;
   }
 }
+
+@media (max-width: 520px) {
+  .theme-controls__presets {
+    display: none;
+  }
+}
diff --git a/projects/demo/src/app/material-showcase/material-showcase.html b/projects/demo/src/app/material-showcase/material-showcase.html
index a7fc1fb..ccb036f 100644
--- a/projects/demo/src/app/material-showcase/material-showcase.html
+++ b/projects/demo/src/app/material-showcase/material-showcase.html
@@ -162,7 +162,7 @@ <h2 id="nav-heading" class="showcase-section__title">Navigation</h2>
           </a>
         </mat-nav-list>
 
-        <button matButton="outlined" [matMenuTriggerFor]="demoMenu">
+        <button class="showcase-menu" matButton="outlined" [matMenuTriggerFor]="demoMenu">
           <mat-icon>more_vert</mat-icon>
           Menu
         </button>
diff --git a/projects/demo/src/app/material-showcase/material-showcase.scss b/projects/demo/src/app/material-showcase/material-showcase.scss
index f5e8dfc..530fc82 100644
--- a/projects/demo/src/app/material-showcase/material-showcase.scss
+++ b/projects/demo/src/app/material-showcase/material-showcase.scss
@@ -1,6 +1,8 @@
 .showcase-grid {
-  display: grid;
+  display: flex;
+  flex-direction: column;
   gap: 1.75rem;
+  width: 100%;
 }
 
 .showcase-section__title {
@@ -73,8 +75,13 @@
   overflow: hidden;
 }
 
+.showcase-menu {
+  align-self: flex-start;
+}
+
 @media (min-width: 960px) {
   .showcase-grid {
+    display: grid;
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }