From 711b8f7678ebf4890b2ec6b09f1c9f9d1cc8aaaf Mon Sep 17 00:00:00 2001
From: Jim Myhrberg <contact@jimeh.me>
Date: Thu, 1 Jan 2026 22:06:07 +0000
Subject: [PATCH] feat(userstyles): add custom DuckDuckGo styles for enhanced
 dark theme support

---
 userstyles/ddg-custom.user.css | 91 ++++++++++++++++++++++++++++++++++
 1 file changed, 91 insertions(+)
 create mode 100644 userstyles/ddg-custom.user.css

diff --git a/userstyles/ddg-custom.user.css b/userstyles/ddg-custom.user.css
new file mode 100644
index 0000000..f32f157
--- /dev/null
+++ b/userstyles/ddg-custom.user.css
@@ -0,0 +1,91 @@
+@-moz-document domain("duckduckgo.com") {
+  /*
+  To be used with the following DuckDuckGo settings:
+  https://duckduckgo.com/?kae=d&kao=-1&kbc=1&kai=b&k1=-1&kak=-1&kaa=c58af9&kay=b&kaq=-1&km=m&k9=8ab4f8&kap=-1&k18=1&kx=7aa1a8&kp=-2&kaj=m&kax=-1&kt=h&kaf=s&kpsb=-1&k7=171824&kj=171824&k8=cccccc&k21=27293d
+*/
+
+  body {
+    --userstyle-bg-base: #171824;
+    --userstyle-bg-light-1: #1f2030;
+    --userstyle-bg-light-2: #27293D;
+    --userstyle-bg-light-3: #30334B;
+    --userstyle-bg-light-4: #373B57;
+    --userstyle-bg-light-5: #3F4464;
+
+    /* Search box background on results page */
+    --sds-color-background-01: var(--userstyle-bg-light-2);
+
+    /* Search box on landing page */
+    --theme-ai-searchbox-bg: var(--userstyle-bg-light-2);
+    --theme-ai-searchbox-bg--focused: var(--userstyle-bg-light-2);
+
+    --theme-col-bg-header: var(--userstyle-bg-base);
+    --theme-col-bg-page: var(--userstyle-bg-base);
+    --theme-col-bg-page-alt-1: var(--userstyle-bg-light-4);
+    --theme-col-bg-page-alt-2: var(--userstyle-bg-light-5);
+    --theme-col-bg-page-alt-3: var(--userstyle-bg-light-3);
+
+    --theme-assist-bg-chat-system: var(--userstyle-bg-light-2);
+
+    --theme-col-bg-button-secondary: var(--userstyle-bg-light-3);
+    --theme-col-bg-button-secondary-hover: var(--userstyle-bg-light-4);
+    --theme-col-bg-button-secondary-active: var(--userstyle-bg-light-5);
+    --theme-col-bg-button-secondary-disabled: var(--userstyle-bg-light-1);
+
+    --sds-color-background-utility: var(--userstyle-bg-light-3);
+    --sds-color-background-utility-state-01: var(--userstyle-bg-light-4);
+    --sds-color-background-utility-state-02: var(--userstyle-bg-light-5);
+
+    --sds-color-background-utility-alt: var(--userstyle-bg-light-2);
+    --sds-color-background-utility-alt-state-01: var(--userstyle-bg-light-3);
+    --sds-color-background-utility-alt-state-02: var(--userstyle-bg-light-4);
+
+    --sds-color-border-01: var(--userstyle-bg-light-3);
+
+    --theme-col-txt-title: #8ab4f8;
+    --theme-col-txt-title-visited: #c58af9;
+
+    --theme-col-txt-snippet: #cccccc;
+    --theme-col-txt-url: #7aa1a8;
+    --theme-col-txt-url-domain: #7aa1a8;
+    --theme-col-txt-url-path: var(--theme-col-txt-url-domain);
+
+    --sds-color-background-container-01: var(--userstyle-bg-light-2);
+    --sds-color-background-container-02: var(--userstyle-bg-light-2);
+    --theme-col-bg-ui: var(--userstyle-bg-light-2);
+    --theme-col-bg-ui-header: var(--userstyle-bg-light-2);
+    --theme-col-bg-card: var(--userstyle-bg-light-2);
+    --theme-col-bg-card-header: var(--userstyle-bg-light-2);
+  }
+
+  .theme-dark .chip-select_root__xmFA3 {
+    --chip-select-bg: var(--userstyle-bg-light-1);
+    --chip-select-indicator-bg: var(--userstyle-bg-light-3);
+    --chip-select-indicator-bg--hover: var(--userstyle-bg-light-4);
+  }
+
+  .header-wrap {
+    box-shadow: 0 1px 0 var(--userstyle-bg-light-3);
+    background-color: var(--theme-col-bg-header) !important;
+  }
+
+  html,
+  body,
+  .body--home,
+  .site-wrapper,
+  .region__body,
+  .badge-link,
+  .module--carousel__image-wrapper,
+  .result__image,
+  .vertical--map__sidebar,
+  .vertical--map__sidebar__header,
+  .page-chrome_newtab,
+  .zci--type--tiles:not(.is-fallback).is-full-page.is-expanded,
+  .zci--type--tiles:not(.is-fallback).is-full-page.is-expanded .metabar:not(.is-stuck) {
+    background-color: var(--theme-col-bg-page) !important;
+  }
+
+  [data-testid="feedback-prompt"] {
+    display: none;
+  }
+}