diff --git a/assets/css/_html.css b/assets/css/_html.css
index d300f95ca..07f084af4 100644
--- a/assets/css/_html.css
+++ b/assets/css/_html.css
@@ -1,4 +1,5 @@
 @import '@fontsource/lato/300.css';
+@import '@fontsource/lato/400.css';
 @import '@fontsource/lato/700.css';
 @import '@fontsource/merriweather/300.css';
 @import '@fontsource/merriweather/300-italic.css';
diff --git a/assets/css/settings.css b/assets/css/settings.css
index 2104b600a..78fc7ba9c 100644
--- a/assets/css/settings.css
+++ b/assets/css/settings.css
@@ -43,6 +43,7 @@
 
 #settings-modal-content .switch-button-container > div > p {
   font-size: 14px;
+  font-weight: 300;
   line-height: 1.4;
   margin: 0;
   padding-bottom: 6px;
diff --git a/assets/css/sidebar.css b/assets/css/sidebar.css
index 9727482e5..4cce00b00 100644
--- a/assets/css/sidebar.css
+++ b/assets/css/sidebar.css
@@ -80,6 +80,9 @@
   line-height: 20px;
   color: var(--sidebarMuted);
 }
+.non-apple-os .sidebar .sidebar-projectVersion {
+  font-weight: 400; /* Non-Apple OSes render small light type too thinly */
+}
 
 .sidebar .sidebar-projectVersionsDropdown {
   cursor: pointer;
@@ -128,6 +131,9 @@
   font-size: 14px;
   color: var(--sidebarMuted);
 }
+.non-apple-os .sidebar .sidebar-listNav :is(li, li a) {
+  font-weight: 400; /* Non-Apple OSes render small light type too thinly */
+}
 
 .sidebar .sidebar-listNav li {
   display: inline-block;
@@ -359,6 +365,9 @@
   margin-right: 0;
   color: var(--sidebarAccentMain);
 }
+.non-apple-os .sidebar #full-list ul li {
+  font-weight: 400; /* Non-Apple OSes render small light type too thinly */
+}
 
 .sidebar #full-list ul li.current-hash {
   color: var(--sidebarActiveItem);
diff --git a/assets/js/entry/html.js b/assets/js/entry/html.js
index 688de44c0..80e86600d 100644
--- a/assets/js/entry/html.js
+++ b/assets/js/entry/html.js
@@ -16,6 +16,7 @@ import { initialize as initTooltips } from '../tooltips/tooltips'
 import { initialize as initHintsPage } from '../tooltips/hint-page'
 import { initialize as initCopyButton } from '../copy-button'
 import { initialize as initSettings } from '../settings'
+import { initialize as initOs } from '../os'
 
 onDocumentReady(() => {
   initTheme()
@@ -33,4 +34,5 @@ onDocumentReady(() => {
   initSearchPage()
   initCopyButton()
   initSettings()
+  initOs()
 })
diff --git a/assets/js/os.js b/assets/js/os.js
new file mode 100644
index 000000000..ed7df2cc1
--- /dev/null
+++ b/assets/js/os.js
@@ -0,0 +1,6 @@
+export function initialize () {
+  const appleDeviceExpr = /(Macintosh|iPhone|iPad|iPod)/
+
+  const osClass = appleDeviceExpr.test(window.navigator.userAgent) ? 'apple-os' : 'non-apple-os'
+  document.documentElement.classList.add(osClass)
+}