make api docs load only required styles files

_includes/shared-chrome/stylesheets.html

@@ -1,3 +1,16 @@
+{% comment %}
+  On the Scalar API reference page (layout: docs-api), the Metabase theme
+  stylesheets bleed into Scalar's own styles (e.g. white-on-white titles in
+  dark mode), so skip them there and load everything else as usual.
+{% endcomment %}
+{% assign css_denylist = "" | split: "," %}
+{% if page.layout == "docs-api" %}{% assign css_denylist = "css/main.css,css/styles.css,css/docs.css" | split: "," %}{% endif %}
 {% for stylesheet in site.data.shared_chrome.stylesheets %}
+  {% assign denied = false %}
+  {% for css in css_denylist %}
+    {% if stylesheet.attributes.href contains css %}{% assign denied = true %}{% endif %}
+  {% endfor %}
+  {% unless denied %}
   <{{ stylesheet.tag }}{% for attribute in stylesheet.attributes %} {{ attribute[0] }}="{{ attribute[1] }}"{% endfor %} />
+  {% endunless %}
 {% endfor %}

css/main.css

@@ -25,18 +25,6 @@ body {
   text-rendering: optimizelegibility;
 }
 
-body.dark-mode {
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6,
-  li {
-    color: white;
-  }
-}
-
 body header.bootstrap {
   position: sticky;
   top: -48px;