diff --git a/index.html b/index.html
index 0ab4784c..bdcad7fd 100644
--- a/index.html
+++ b/index.html
@@ -30,11 +30,13 @@
   <body>
     <div class="wrapper">
       <nav class="panel container">
-        <h1>
-          <a href="./">WebGPU Samples</a>
-        </h1>
-        <input type="checkbox" id="menuToggle">
-        <label class="expand" for="menuToggle"></label>
+        <section>
+          <h1>
+            <a href="./">WebGPU Samples</a>
+          </h1>
+          <input type="checkbox" id="menuToggle">
+          <label class="expand" for="menuToggle"></label>
+        </section>
         <div class="panelContents">
           <search>
             <hr />
diff --git a/public/css/MainLayout.css b/public/css/MainLayout.css
index b8906414..6c1f9fdd 100644
--- a/public/css/MainLayout.css
+++ b/public/css/MainLayout.css
@@ -1,3 +1,7 @@
+:root {
+  interpolate-size: allow-keywords;
+}
+
 .container {
   padding-left: 15px;
   padding-right: 15px;
@@ -64,6 +68,12 @@ main {
   overflow: auto;
 }
 
+section {
+  & > h1 {
+    font-size: 1.5rem;
+  }
+}
+
 search {
   inline-size: 100%;
   margin-block-end: 20px;
@@ -114,13 +124,13 @@ search {
     overflow: visible;
   }
 
-  #menuToggle ~ .panelContents {
+  section:has(#menuToggle) ~ .panelContents {
     max-height: 0;
     overflow: hidden;
   }
 
-  #menuToggle:checked ~ .panelContents {
-    max-height: 2000px;
+  section:has(#menuToggle:checked) ~ .panelContents {
+    max-height: max-content;
   }
 
   .panel .panelContents {
@@ -138,6 +148,4 @@ search {
   .expand {
     display: inline-block;
   }
-
 }
-
