diff --git a/__tests__/responsive.test.js b/__tests__/responsive.test.js
index 5730df9..b64329b 100644
--- a/__tests__/responsive.test.js
+++ b/__tests__/responsive.test.js
@@ -99,3 +99,17 @@ test('sidebar opens on small screens', async () => {
   expect(bodyClass).toBe(true);
   expect(sidebarLeft).toBe('0px');
 });
+
+test('sidebar toggles on large screens', async () => {
+  const page = await browser.newPage();
+  await page.setViewport({ width: 1024, height: 800 });
+  await page.goto(`http://localhost:${port}/`);
+  await page.waitForSelector('#sidebar-toggle');
+  await new Promise(r => setTimeout(r, 300));
+  let sidebarWidth = await page.evaluate(() => getComputedStyle(document.querySelector('.sidebar')).width);
+  expect(sidebarWidth).toBe('240px');
+  await page.click('#sidebar-toggle');
+  await new Promise(r => setTimeout(r, 300));
+  sidebarWidth = await page.evaluate(() => getComputedStyle(document.querySelector('.sidebar')).width);
+  expect(sidebarWidth).toBe('0px');
+});
diff --git a/assets/theme.css b/assets/theme.css
index 0f7f08d..bf1aea0 100644
--- a/assets/theme.css
+++ b/assets/theme.css
@@ -114,3 +114,14 @@ main {
   }
   body.sidebar-open .sidebar { left: 0; }
 }
+
+@media (min-width: 769px) {
+  .sidebar {
+    transition: width 0.2s ease;
+  }
+  body:not(.sidebar-open) .sidebar {
+    width: 0;
+    padding: 0;
+    overflow: hidden;
+  }
+}
diff --git a/assets/theme.js b/assets/theme.js
index 9b348d0..ddc978f 100644
--- a/assets/theme.js
+++ b/assets/theme.js
@@ -12,6 +12,10 @@ document.addEventListener('DOMContentLoaded', () => {
   const stored = localStorage.getItem('theme');
   if (stored) setTheme(stored);
 
+  if (window.innerWidth > 768) {
+    document.body.classList.add('sidebar-open');
+  }
+
   sidebarToggle?.addEventListener('click', () => {
     document.body.classList.toggle('sidebar-open');
   });