diff --git a/docs/_includes/base.njk b/docs/_includes/base.njk
index 21bfd33a6..62221b965 100644
--- a/docs/_includes/base.njk
+++ b/docs/_includes/base.njk
@@ -20,7 +20,7 @@
   </head>
   <body class="layout-{{ layout | stripExtension }}{{ ' page-wide' if wide }}">
     <!-- use view="desktop" as default to reduce layout jank on desktop site. -->
-    <wa-page view="desktop" disable-navigation-toggle="">
+    <wa-page view="desktop" disable-navigation-toggle="" mobile-breakpoint="1140">
       <header slot="header" class="wa-split">
         {# Logo #}
         <div id="docs-branding">
@@ -33,13 +33,13 @@
             <span class="wa-desktop-only">{% include "logo.njk" %}</span>
             <span class="wa-mobile-only">{% include "logo-simple.njk" %}</span>
           </a>
-          <small id="version-number" class="only-desktop">{{ package.version }}</small>
-          <wa-badge variant="warning" appearance="filled" class="only-desktop">Alpha</wa-badge>
+          <small id="version-number" class="wa-desktop-only">{{ package.version }}</small>
+          <wa-badge variant="warning" appearance="filled" class="wa-desktop-only">Alpha</wa-badge>
         </div>
 
         <div id="docs-toolbar" class="wa-cluster wa-gap-xs">
           {# Desktop selectors #}
-          <div class="only-desktop wa-cluster wa-gap-xs">
+          <div class="wa-desktop-only wa-cluster wa-gap-xs">
             {% include "preset-theme-selector.njk" %}
             {% include "color-scheme-selector.njk" %}
           </div>
@@ -48,7 +48,7 @@
           <wa-button id="search-trigger" appearance="outlined" size="small" data-search>
             <wa-icon slot="prefix" name="magnifying-glass"></wa-icon>
             Search
-            <kbd slot="suffix" class="only-desktop">/</kbd>
+            <kbd slot="suffix" class="wa-desktop-only">/</kbd>
           </wa-button>
 
           {# Login #}
diff --git a/docs/_layouts/theme.njk b/docs/_layouts/theme.njk
index 63693354c..bbbf4cf87 100644
--- a/docs/_layouts/theme.njk
+++ b/docs/_layouts/theme.njk
@@ -25,8 +25,8 @@ wa_data.palettes = {
   {% endfor %}
 };
 </script>
-<link href="{{ page.url }}../remix.css" rel="stylesheet">
-<script src="{{ page.url }}../remix.js" type="module"></script>
+<link href="/docs/themes/remix.css" rel="stylesheet">
+<script src="/docs/themes/remix.js" type="module"></script>
 {% endblock %}
 
 {% block header %}
diff --git a/docs/assets/styles/docs.css b/docs/assets/styles/docs.css
index cae9f5b10..e03a02ff3 100644
--- a/docs/assets/styles/docs.css
+++ b/docs/assets/styles/docs.css
@@ -608,13 +608,6 @@ table.colors {
   margin-block-end: var(--wa-flow-spacing);
 }
 
-/** mobile */
-@media screen and (max-width: 768px) {
-  wa-page .only-desktop {
-    display: none;
-  }
-}
-
 /** desktop */
 @media screen and not (max-width: 768px) {
   /* Navigation sidebar */
diff --git a/docs/docs/themes/remix.js b/docs/docs/themes/remix.js
index a6e9d8413..373027235 100644
--- a/docs/docs/themes/remix.js
+++ b/docs/docs/themes/remix.js
@@ -30,8 +30,8 @@ function init() {
 
   codeSnippets = document.querySelector('#usage ~ wa-tab-group.import-stylesheet-code:first-of-type');
   codeSnippets = {
-    html: codeSnippets.querySelector('code.language-html'),
-    css: codeSnippets.querySelector('code.language-css'),
+    html: codeSnippets?.querySelector('code.language-html'),
+    css: codeSnippets?.querySelector('code.language-css'),
   };
 
   data = {
@@ -73,11 +73,10 @@ function init() {
 
   Promise.all(Object.values(selects).map(select => select.updateComplete)).then(() => render());
 
-  return { selects, codeSnippets, data, computed, render };
+  globalThis.remixApp = { selects, codeSnippets, data, computed, render };
 }
 
-globalThis.remixApp = init();
-
+init();
 // Async load CSS for other themes *before* current theme stylesheet
 let themeStylesheet = document.querySelector('#theme-stylesheet');
 
@@ -151,12 +150,14 @@ function render(changedAspect) {
   // Update code snippets
   for (let language in codeSnippets) {
     let codeSnippet = codeSnippets[language];
+    if (!codeSnippet) {
+      continue;
+    }
+
     let code = getThemeCode(data.baseTheme, data.params, { language, cdnUrl });
     codeSnippet.textContent = code;
     Prism.highlightElement(codeSnippet);
   }
 }
 
-addEventListener('turbo:render', event => {
-  remixApp = init();
-});
+addEventListener('turbo:render', init);
