diff --git a/src/App.css b/src/App.css
index 7cf4402..614c72f 100644
--- a/src/App.css
+++ b/src/App.css
@@ -14,7 +14,7 @@ body,
 }
 
 @media (max-width: 767px) {
-  .theme-toggle {
+  body:not(:has(.intro-root)) .theme-toggle {
     bottom: calc(3rem + 1rem + env(safe-area-inset-bottom, 0px));
   }
 }
diff --git a/src/components/UI/contentPanel.tsx b/src/components/UI/contentPanel.tsx
index 2dcaacd..96d00b1 100644
--- a/src/components/UI/contentPanel.tsx
+++ b/src/components/UI/contentPanel.tsx
@@ -14,10 +14,10 @@ export const ContentPanel: React.FC<ContentPanelProps> = ({
       backgroundColor: "var(--color-panel-bg)",
       borderRadius: "0.75rem",
       padding: "2rem 1rem 2rem 1rem",
-      height: "fit-content",
+      minHeight: "100%",
       color: "var(--color-text)",
     }}
-    className={`w-full max-w-full ${className ?? ""}`.trim()}
+    className={`w-full max-w-full min-h-full ${className ?? ""}`.trim()}
   >
     {children}
   </div>
diff --git a/src/index.css b/src/index.css
index 3b6859d..a890b8f 100644
--- a/src/index.css
+++ b/src/index.css
@@ -44,8 +44,8 @@
   --color-text-nav: rgba(255, 255, 255, 0.87);
   --color-text-nav-accent: rgba(255, 255, 255, 0.55);
   --color-link: #818cf8;
-  --color-panel-bg: rgba(255, 255, 255, 0.1);
-  --color-border: #52525b;
+  --color-panel-bg: #3f3f4696;
+  --color-border: #e4e4e75e;
   --color-wave: #3f3f46;
   --color-prompt-text: antiquewhite;
   --color-cursor: #f97316;
diff --git a/src/layout/section.layout.tsx b/src/layout/section.layout.tsx
index ab1fe57..f31d87a 100644
--- a/src/layout/section.layout.tsx
+++ b/src/layout/section.layout.tsx
@@ -5,6 +5,8 @@ interface SectionLayoutProps {
 }
 export const SectionLayout: React.FC<SectionLayoutProps> = ({ children }) => {
   return (
-    <section className="flex w-full min-w-0 p-4 md:p-8">{children}</section>
+    <section className="flex w-full min-w-0 min-h-full items-stretch p-4 md:p-8">
+      {children}
+    </section>
   );
 };
diff --git a/src/pages/intro/introPage.tsx b/src/pages/intro/introPage.tsx
index 31bcd35..d6559f9 100644
--- a/src/pages/intro/introPage.tsx
+++ b/src/pages/intro/introPage.tsx
@@ -45,6 +45,7 @@ export const IntroPage: React.FC = () => {
           <link rel="preload" as="image" href={avatarImg} />
         </Helmet>
         <h1
+          className="intro-root"
           style={{
             position: "absolute",
             width: "1px",
diff --git a/src/pages/theBuzz/about.test.tsx b/src/pages/theBuzz/about.test.tsx
index b81fdb9..63f5958 100644
--- a/src/pages/theBuzz/about.test.tsx
+++ b/src/pages/theBuzz/about.test.tsx
@@ -20,7 +20,7 @@ describe("About", () => {
     const section = container.querySelector("section");
     const panel = container.querySelector("section > div");
 
-    expect(section).toHaveClass("w-full", "min-w-0");
-    expect(panel).toHaveClass("w-full", "max-w-full");
+    expect(section).toHaveClass("w-full", "min-w-0", "min-h-full");
+    expect(panel).toHaveClass("w-full", "max-w-full", "min-h-full");
   });
 });
diff --git a/src/pages/theBuzz/buzzPage.test.tsx b/src/pages/theBuzz/buzzPage.test.tsx
index 5772516..c1396e5 100644
--- a/src/pages/theBuzz/buzzPage.test.tsx
+++ b/src/pages/theBuzz/buzzPage.test.tsx
@@ -73,6 +73,6 @@ describe("BuzzPage", () => {
 
     expect(pageOverlay).toHaveClass("absolute", "inset-0", "w-full", "h-full");
     expect(pageOverlay).not.toHaveClass("fixed");
-    expect(contentWrapper).toHaveClass("min-w-0");
+    expect(contentWrapper).toHaveClass("h-full", "min-w-0");
   });
 });
diff --git a/src/pages/theBuzz/buzzPage.tsx b/src/pages/theBuzz/buzzPage.tsx
index a36b182..2be5b75 100644
--- a/src/pages/theBuzz/buzzPage.tsx
+++ b/src/pages/theBuzz/buzzPage.tsx
@@ -69,7 +69,7 @@ export const BuzzPage: React.FC = () => {
           {/* Content */}
           <div
             key={location.pathname}
-            className="flex-1 min-w-0 min-h-0 mx-2 md:mx-5 overflow-y-auto overflow-x-hidden pt-16 pb-14 md:pt-0 md:pb-0"
+            className="flex-1 h-full min-w-0 min-h-0 mx-2 md:mx-5 overflow-y-auto overflow-x-hidden pt-16 pb-14 md:pt-0 md:pb-0"
           >
             <Suspense fallback={null}>
               <Outlet />
diff --git a/src/pages/theBuzz/experience.test.tsx b/src/pages/theBuzz/experience.test.tsx
index 132756d..804ba62 100644
--- a/src/pages/theBuzz/experience.test.tsx
+++ b/src/pages/theBuzz/experience.test.tsx
@@ -33,7 +33,7 @@ describe("Experience", () => {
     const section = container.querySelector("section");
     const panel = container.querySelector("section > div");
 
-    expect(section).toHaveClass("w-full", "min-w-0");
-    expect(panel).toHaveClass("w-full", "max-w-full");
+    expect(section).toHaveClass("w-full", "min-w-0", "min-h-full");
+    expect(panel).toHaveClass("w-full", "max-w-full", "min-h-full");
   });
 });
diff --git a/src/pages/theBuzz/experience.tsx b/src/pages/theBuzz/experience.tsx
index f6cff61..4b8383c 100644
--- a/src/pages/theBuzz/experience.tsx
+++ b/src/pages/theBuzz/experience.tsx
@@ -10,161 +10,161 @@ export const Experience: React.FC = () => {
       <SectionLayout>
         <ContentPanel>
           <div className="flex flex-col gap-5 max-w-150 justify-self-center">
-          <h1>Experience</h1>
-          <article className="flex flex-col gap-4">
-            <header className="gap-1">
-              <h2 className="text-base md:text-xl font-bold">
-                LawPDF, Independent
-              </h2>
-              <p className="text-sm md:text-lg">2025-2026</p>
-              <ul className="flex flex-wrap text-sm md:text-md font-semibold gap-x-2">
-                <li className="list-none">Next.js</li>
-                <li className="list-none">Node.js</li>
-                <li className="list-none">AWS</li>
-                <li className="list-none">AI</li>
-              </ul>
-            </header>
-            <p className="font-light">
-              Built a platform that allows legal professionals and clients to
-              gather case files and automatically generate referenced,
-              summarized documents. Handled all technical execution, from
-              initial infrastructure setup to production deployment and data
-              security.
-            </p>
-          </article>
+            <h1>Experience</h1>
+            <article className="flex flex-col gap-4">
+              <header className="gap-1">
+                <h2 className="text-base md:text-xl font-bold">
+                  LawPDF, Independent
+                </h2>
+                <p className="text-sm md:text-lg">2025-2026</p>
+                <ul className="flex flex-wrap text-sm md:text-md font-semibold gap-x-2">
+                  <li className="list-none">Next.js</li>
+                  <li className="list-none">Node.js</li>
+                  <li className="list-none">AWS</li>
+                  <li className="list-none">AI</li>
+                </ul>
+              </header>
+              <p className="font-light">
+                Built a platform that allows legal professionals and clients to
+                gather case files and automatically generate referenced,
+                summarized documents. Handled all technical execution, from
+                initial infrastructure setup to production deployment and data
+                security.
+              </p>
+            </article>
 
-          <article className="flex flex-col gap-4">
-            <header className="gap-1">
-              <h2 className="text-base md:text-xl font-bold">
-                Clarity, Fullstack Team Lead
-              </h2>
-              <p className="text-sm md:text-lg">2023-2025</p>
-              <ul className="flex flex-wrap text-sm md:text-md font-semibold gap-x-2">
-                <li className="list-none">AWS</li>
-                <li className="list-none">Serverless</li>
-                <li className="list-none">Vue.js</li>
-                <li className="list-none">Node.js</li>
-                <li className="list-none">Apollo</li>
-                <li className="list-none">MongoDB</li>
-              </ul>
-            </header>
-            <p className="font-light">
-              Ran technical design and delivery for the company's core product.
-              Established architectural standards, managed the CI/CD pipeline,
-              and ensured high availability and performance for high-traffic,
-              business-critical features.
-            </p>
-          </article>
+            <article className="flex flex-col gap-4">
+              <header className="gap-1">
+                <h2 className="text-base md:text-xl font-bold">
+                  Clarity, Fullstack Team Lead
+                </h2>
+                <p className="text-sm md:text-lg">2023-2025</p>
+                <ul className="flex flex-wrap text-sm md:text-md font-semibold gap-x-2">
+                  <li className="list-none">AWS</li>
+                  <li className="list-none">Serverless</li>
+                  <li className="list-none">Vue.js</li>
+                  <li className="list-none">Node.js</li>
+                  <li className="list-none">Apollo</li>
+                  <li className="list-none">MongoDB</li>
+                </ul>
+              </header>
+              <p className="font-light">
+                Ran technical design and delivery for the company's core
+                product. Established architectural standards, managed the CI/CD
+                pipeline, and ensured high availability and performance for
+                high-traffic, business-critical features.
+              </p>
+            </article>
 
-          <article className="flex flex-col gap-4">
-            <header className="gap-1">
-              <h2 className="text-base md:text-xl font-bold">
-                Daytwo, Fullstack Team Lead
-              </h2>
-              <p className="text-sm md:text-lg">2018-2023</p>
-              <ul className="flex flex-wrap text-sm md:text-md font-semibold gap-x-2">
-                <li className="list-none">GCP</li>
-                <li className="list-none">AWS</li>
-                <li className="list-none">CDK</li>
-                <li className="list-none">React</li>
-                <li className="list-none">Node.js</li>
-                <li className="list-none">mySQL</li>
-              </ul>
-            </header>
-            <p className="font-light">
-              Directed local and offshore engineering teams. Scaled backend
-              infrastructure to support high-throughput processing, enforcing
-              strict security and compliance standards for handling sensitive
-              international data.
-            </p>
-          </article>
+            <article className="flex flex-col gap-4">
+              <header className="gap-1">
+                <h2 className="text-base md:text-xl font-bold">
+                  Daytwo, Fullstack Team Lead
+                </h2>
+                <p className="text-sm md:text-lg">2018-2023</p>
+                <ul className="flex flex-wrap text-sm md:text-md font-semibold gap-x-2">
+                  <li className="list-none">GCP</li>
+                  <li className="list-none">AWS</li>
+                  <li className="list-none">CDK</li>
+                  <li className="list-none">React</li>
+                  <li className="list-none">Node.js</li>
+                  <li className="list-none">mySQL</li>
+                </ul>
+              </header>
+              <p className="font-light">
+                Directed local and offshore engineering teams. Scaled backend
+                infrastructure to support high-throughput processing, enforcing
+                strict security and compliance standards for handling sensitive
+                international data.
+              </p>
+            </article>
 
-          <article className="flex flex-col gap-4">
-            <header className="gap-1">
-              <h2 className="text-base md:text-xl font-bold">
-                Softwave, Fullstack Dev
-              </h2>
-              <p className="text-sm md:text-lg">2016-2018</p>
-              <ul className="flex flex-wrap text-sm md:text-md font-semibold gap-x-2">
-                <li className="list-none">Azure</li>
-                <li className="list-none">Angular</li>
-                <li className="list-none">React</li>
-                <li className="list-none">.Net Core</li>
-                <li className="list-none">SQL</li>
-              </ul>
-            </header>
-            <p className="font-light">
-              Shipped end-to-end features for enterprise clients. Transitioned
-              legacy systems to modern frontend frameworks and built out the
-              supporting backend architecture and database schemas.
-            </p>
-          </article>
+            <article className="flex flex-col gap-4">
+              <header className="gap-1">
+                <h2 className="text-base md:text-xl font-bold">
+                  Softwave, Fullstack Dev
+                </h2>
+                <p className="text-sm md:text-lg">2016-2018</p>
+                <ul className="flex flex-wrap text-sm md:text-md font-semibold gap-x-2">
+                  <li className="list-none">Azure</li>
+                  <li className="list-none">Angular</li>
+                  <li className="list-none">React</li>
+                  <li className="list-none">.Net Core</li>
+                  <li className="list-none">SQL</li>
+                </ul>
+              </header>
+              <p className="font-light">
+                Shipped end-to-end features for enterprise clients. Transitioned
+                legacy systems to modern frontend frameworks and built out the
+                supporting backend architecture and database schemas.
+              </p>
+            </article>
 
-          <article className="flex flex-col gap-4">
-            <header className="gap-1">
-              <h2 className="text-base md:text-xl font-bold">
-                Eternity, Fullstack Dev
-              </h2>
-              <p className="text-sm md:text-lg">2015-2016</p>
-              <ul className="flex flex-wrap text-sm md:text-md font-semibold gap-x-2">
-                <li className="list-none">Azure</li>
-                <li className="list-none">Javascript</li>
-                <li className="list-none">HTML</li>
-                <li className="list-none">CSS</li>
-                <li className="list-none">ASP.Net</li>
-                <li className="list-none">C#</li>
-                <li className="list-none">SQL</li>
-              </ul>
-            </header>
-            <p className="font-light">
-              Provisioned and maintained production cloud environments on Azure.
-              Handled deployment pipelines, server configurations, and
-              operational monitoring for web applications.
-            </p>
-          </article>
+            <article className="flex flex-col gap-4">
+              <header className="gap-1">
+                <h2 className="text-base md:text-xl font-bold">
+                  Eternity, Fullstack Dev
+                </h2>
+                <p className="text-sm md:text-lg">2015-2016</p>
+                <ul className="flex flex-wrap text-sm md:text-md font-semibold gap-x-2">
+                  <li className="list-none">Azure</li>
+                  <li className="list-none">Javascript</li>
+                  <li className="list-none">HTML</li>
+                  <li className="list-none">CSS</li>
+                  <li className="list-none">ASP.Net</li>
+                  <li className="list-none">C#</li>
+                  <li className="list-none">SQL</li>
+                </ul>
+              </header>
+              <p className="font-light">
+                Provisioned and maintained production cloud environments on
+                Azure. Handled deployment pipelines, server configurations, and
+                operational monitoring for web applications.
+              </p>
+            </article>
 
-          <article className="flex flex-col gap-4">
-            <header className="gap-1">
-              <h2 className="text-base md:text-xl font-bold">
-                Qpoint, Fullstack Dev
-              </h2>
-              <p className="text-sm md:text-lg">2014-2015</p>
-              <ul className="flex flex-wrap text-sm md:text-md font-semibold gap-x-2">
-                <li className="list-none">Javascript</li>
-                <li className="list-none">HTML</li>
-                <li className="list-none">CSS</li>
-                <li className="list-none">ASP.Net</li>
-                <li className="list-none">C#</li>
-                <li className="list-none">SQL</li>
-              </ul>
-            </header>
-            <p className="font-light">
-              Contributed to a highly structured enterprise codebase. Focused on
-              writing testable code, conducting rigorous reviews, and
-              maintaining strict engineering and version control standards.
-            </p>
-          </article>
+            <article className="flex flex-col gap-4">
+              <header className="gap-1">
+                <h2 className="text-base md:text-xl font-bold">
+                  Qpoint, Fullstack Dev
+                </h2>
+                <p className="text-sm md:text-lg">2014-2015</p>
+                <ul className="flex flex-wrap text-sm md:text-md font-semibold gap-x-2">
+                  <li className="list-none">Javascript</li>
+                  <li className="list-none">HTML</li>
+                  <li className="list-none">CSS</li>
+                  <li className="list-none">ASP.Net</li>
+                  <li className="list-none">C#</li>
+                  <li className="list-none">SQL</li>
+                </ul>
+              </header>
+              <p className="font-light">
+                Contributed to a highly structured enterprise codebase. Focused
+                on writing testable code, conducting rigorous reviews, and
+                maintaining strict engineering and version control standards.
+              </p>
+            </article>
 
-          <article className="flex flex-col gap-4">
-            <header className="gap-1">
-              <h2 className="text-base md:text-xl font-bold">
-                Bynet, Fullstack Dev
-              </h2>
-              <p className="text-sm md:text-lg">2012-2014</p>
-              <ul className="flex flex-wrap text-sm md:text-md font-semibold gap-x-2">
-                <li className="list-none">Javascript</li>
-                <li className="list-none">HTML</li>
-                <li className="list-none">CSS</li>
-                <li className="list-none">ASP.Net</li>
-                <li className="list-none">C#</li>
-              </ul>
-            </header>
-            <p className="font-light">
-              Developed foundational server-side and client-side logic for core
-              applications. Handled database design, API creation, and frontend
-              integration.
-            </p>
-          </article>
+            <article className="flex flex-col gap-4">
+              <header className="gap-1">
+                <h2 className="text-base md:text-xl font-bold">
+                  Bynet, Fullstack Dev
+                </h2>
+                <p className="text-sm md:text-lg">2012-2014</p>
+                <ul className="flex flex-wrap text-sm md:text-md font-semibold gap-x-2">
+                  <li className="list-none">Javascript</li>
+                  <li className="list-none">HTML</li>
+                  <li className="list-none">CSS</li>
+                  <li className="list-none">ASP.Net</li>
+                  <li className="list-none">C#</li>
+                </ul>
+              </header>
+              <p className="font-light">
+                Developed foundational server-side and client-side logic for
+                core applications. Handled database design, API creation, and
+                frontend integration.
+              </p>
+            </article>
           </div>
         </ContentPanel>
       </SectionLayout>
diff --git a/src/pages/theBuzz/toolbox.test.tsx b/src/pages/theBuzz/toolbox.test.tsx
index 5c04f73..e40c39b 100644
--- a/src/pages/theBuzz/toolbox.test.tsx
+++ b/src/pages/theBuzz/toolbox.test.tsx
@@ -40,7 +40,7 @@ describe("Toolbox", () => {
     const pageSection = container.querySelector("section");
     const panel = container.querySelector("section > div");
 
-    expect(pageSection).toHaveClass("w-full", "min-w-0");
-    expect(panel).toHaveClass("w-full", "max-w-full");
+    expect(pageSection).toHaveClass("w-full", "min-w-0", "min-h-full");
+    expect(panel).toHaveClass("w-full", "max-w-full", "min-h-full");
   });
 });
diff --git a/src/pages/theBuzz/toolbox.tsx b/src/pages/theBuzz/toolbox.tsx
index 2f7f8fb..286abf2 100644
--- a/src/pages/theBuzz/toolbox.tsx
+++ b/src/pages/theBuzz/toolbox.tsx
@@ -112,38 +112,38 @@ export const Toolbox: React.FC = () => {
       <SectionLayout>
         <ContentPanel>
           <div className="grid grid-cols-2 lg:grid-cols-3 gap-4 content-start max-w-150 justify-self-center">
-          <h1 className="col-span-full">Toolbox</h1>
-          {skills.map((skill) => (
-            <section
-              key={skill.title}
-              aria-labelledby={`toolbox-${skill.title.toLowerCase()}-heading`}
-              className="border border-border bg-panel-bg rounded-xl p-3 flex flex-col gap-3"
-            >
-              <h2
-                id={`toolbox-${skill.title.toLowerCase()}-heading`}
-                className="text-xs font-bold uppercase tracking-wider text-text-muted"
+            <h1 className="col-span-full">Toolbox</h1>
+            {skills.map((skill) => (
+              <section
+                key={skill.title}
+                aria-labelledby={`toolbox-${skill.title.toLowerCase()}-heading`}
+                className="border border-border bg-panel-bg rounded-xl p-3 flex flex-col gap-3"
               >
-                {skill.title}
-              </h2>
-              <ul className="grid grid-cols-1 min-[420px]:grid-cols-2 gap-2">
-                {skill.technologies.map((tech) => (
-                  <li
-                    key={tech.name}
-                    className="list-none flex flex-col items-center gap-1 p-2 border border-border bg-panel-bg rounded-lg text-xs text-text font-medium transition-all hover:shadow-lg hover:saturate-175 hover:scale-105"
-                  >
-                    <img
-                      src={tech.icon}
-                      alt=""
-                      aria-hidden="true"
-                      role="presentation"
-                      className="w-8 h-8"
-                    />
-                    {tech.name}
-                  </li>
-                ))}
-              </ul>
-            </section>
-          ))}
+                <h2
+                  id={`toolbox-${skill.title.toLowerCase()}-heading`}
+                  className="text-xs font-bold uppercase tracking-wider text-text-muted"
+                >
+                  {skill.title}
+                </h2>
+                <ul className="grid grid-cols-1 min-[420px]:grid-cols-2 gap-2">
+                  {skill.technologies.map((tech) => (
+                    <li
+                      key={tech.name}
+                      className="list-none flex flex-col items-center gap-1 p-2 border border-border bg-panel-bg rounded-lg text-xs text-text font-medium transition-all hover:shadow-lg hover:saturate-175 hover:scale-105"
+                    >
+                      <img
+                        src={tech.icon}
+                        alt=""
+                        aria-hidden="true"
+                        role="presentation"
+                        className="w-8 h-8"
+                      />
+                      {tech.name}
+                    </li>
+                  ))}
+                </ul>
+              </section>
+            ))}
           </div>
         </ContentPanel>
       </SectionLayout>