diff --git a/custom.css b/custom.css
index b88e482..24da94b 100644
--- a/custom.css
+++ b/custom.css
@@ -188,7 +188,7 @@ a.tag:hover {
 
 .white-theme,
 html[data-theme=light] {
-  --ct-primary-color: #106ba3;
+  --ct-primary-color: #ffffff;
   --ct-secondary-color: #004174;
   --ct-warning-color: #ff7262;
   --ct-success-color: #0dcf82;
@@ -226,8 +226,10 @@ html[data-theme=light] {
   --done-fg: #0dcf82;
   --done-emphasis: #0dcf82;
   --ls-primary-background-color: var(--canvas-default);
+  --ls-primary-background-color-1: #002b36;
   --ls-secondary-background-color: var(--canvas-subtle);
   --ls-tertiary-background-color: var(--scale-gray-1);
+  --ls-tertiary-background-color-1: var(--color-level-2-1);
   --ls-quaternary-background-color: var(--scale-gray-2);
   --ls-table-tr-even-background-color: var(--canvas-subtle);
   --ls-active-primary-color: var(--accent-fg);
@@ -241,6 +243,7 @@ html[data-theme=light] {
   --ls-guideline-color: var(--border-muted);
   --ls-menu-hover-color: var(--ls-secondary-background-color);
   --ls-primary-text-color: var(--fg-default);
+  --ls-primary-text-color-1: rgb(40, 40, 40);
   --ls-secondary-text-color: var(--fg-muted);
   --ls-title-text-color: var(--fg-default);
   --ls-link-text-color: var(--ls-active-primary-color);
@@ -271,7 +274,9 @@ html[data-theme=light] {
   --ls-a-chosen-bg: var(--ls-secondary-background-color);
   --ls-right-sidebar-code-bg-color: var(--ls-secondary-background-color);
   --color-level-1: var(--ls-secondary-background-color);
+  --color-level-1-1: #ffffff;
   --color-level-2: var(--ls-tertiary-background-color);
+  --color-level-2-1: #e9ecef;
   --color-level-3: var(--ls-quaternary-background-color);
   --color-level-4: var(--scale-gray-3);
   --color-level-5: var(--scale-gray-4);
@@ -308,7 +313,7 @@ html[data-theme=light] .extensions__code-lang {
 
 .dark-theme,
 html[data-theme=dark] {
-  --ct-primary-color: #a3cef1;
+  --ct-primary-color: #0d1117;
   --ct-secondary-color: #6096ba;
   --ct-warning-color: #ff7262;
   --ct-success-color: #0dcf82;
@@ -345,8 +350,10 @@ html[data-theme=dark] {
   --done-fg: #0dcf82;
   --done-emphasis: #0dcf82;
   --ls-primary-background-color: var(--canvas-default);
+  --ls-primary-background-color-1: #e9ecef;
   --ls-secondary-background-color: var(--canvas-subtle);
   --ls-tertiary-background-color: var(--scale-gray-7);
+  --ls-tertiary-background-color-1: var(--color-level-2-1);
   --ls-quaternary-background-color: var(--scale-gray-6);
   --ls-table-tr-even-background-color: var(--canvas-subtle);
   --ls-active-primary-color: var(--accent-fg);
@@ -360,6 +367,7 @@ html[data-theme=dark] {
   --ls-guideline-color: var(--border-muted);
   --ls-menu-hover-color: var(--ls-secondary-background-color);
   --ls-primary-text-color: var(--fg-default);
+  --ls-primary-text-color-1: rgb(235, 235, 235);
   --ls-secondary-text-color: var(--fg-muted);
   --ls-title-text-color: var(--fg-default);
   --ls-link-text-color: var(--ls-active-primary-color);
@@ -390,7 +398,9 @@ html[data-theme=dark] {
   --ls-a-chosen-bg: var(--ls-secondary-background-color);
   --ls-right-sidebar-code-bg-color: var(--ls-secondary-background-color);
   --color-level-1: var(--ls-secondary-background-color);
+  --color-level-1-1: #0d1117;
   --color-level-2: var(--ls-tertiary-background-color);
+  --color-level-2-1: #38434c;
   --color-level-3: var(--ls-quaternary-background-color);
   --color-level-4: var(--scale-gray-5);
   --color-level-5: var(--scale-gray-4);
@@ -515,4 +525,79 @@ a.priority::before {
 a.tooltip-priority:first-of-type::before {
   margin-left: 0.3em;
   margin-top: 0.5em;
+}
+
+/* Page preview title */
+.tippy-wrapper > :is(div:first-child, h2:first-child, .block-parents) {
+  display: inline-flex;
+  align-items: center;
+  position: absolute;
+  left: -0.5em;
+  top: -0.75em;
+  z-index: 2;
+  opacity: 1;
+  padding: 2px 1em 2px 1em !important;
+  background: var(--ct-query-header-background);
+  white-space: nowrap;
+  font-family: "Only Emoji", "Source Sans 3 VF", "Source Han Sans VF", sans-serif;
+  font-weight: 600;
+  color: var(--ct-query-header-color);
+  font-style: inherit !important;
+  border: 2px solid #000;
+  border-radius: 4px;
+}
+
+.tippy-wrapper > :is(div:first-child, h2:first-child, .block-parents) a {
+  color: var(--ct-query-header-color);
+}
+
+:root {
+  --ct-query-header-color: var(--ls-primary-background-color-1);
+  --ct-query-header-background: var(--ct-primary-color);
+}
+
+/* query */
+.custom-query > div:first-child {
+  box-shadow: 0 0 0 2px var(--color-level-2-1);
+  background-color: var(--color-level-1-1);
+  border-radius: 8px;
+  padding: 1rem 1.5rem;
+  margin: 2px;
+  position: relative;
+}
+
+.embed .custom-query > div:first-child {
+  background: var(--ls-tertiary-background-color-1);
+}
+
+.dsl-query .custom-query-title > .font-medium,
+:not(.dsl-query) > .custom-query .custom-query-title {
+  display: inline-block;
+  opacity: 1;
+  padding: 2px 10px !important;
+  background: var(--ct-query-header-background);
+  color: var(--ct-query-header-color);
+  font-family: "Fira Code", monospace;
+  font-size: 0.8em;
+  font-style: inherit !important;
+  border-radius: 2px;
+}
+
+:not(.dsl-query) > .custom-query .custom-query-title > .flex-row {
+  position: absolute;
+  left: 24px;
+  text-shadow: none;
+  font-family: inherit;
+  color: var(--ls-primary-text-color-1);
+  font-size: 0.875rem;
+  font-family: "Only Emoji", "Source Sans 3 VF", "Source Han Sans VF", sans-serif;
+}
+
+.dsl-query > .custom-query .foldable-title .opacity-70 code {
+  background: none;
+  color: var(--ct-query-header-color);
+}
+
+.block-body > .custom-query .foldable-title .opacity-70 > * {
+  color: var(--ct-query-header-color);
 }
\ No newline at end of file