:root {
  --mocha-crust: #080706;
  --mocha-mantle: #0d0b0a;
  --mocha-base: #12100e;
  --mocha-panel: #151210;
  --mocha-surface-0: #1a1715;
  --mocha-surface-1: #211e1b;
  --mocha-surface-2: #26221f;
  --mocha-surface-3: #302b27;
  --mocha-overlay-0: #3a3430;
  --mocha-overlay-1: #504840;
  --mocha-overlay-2: #6d655f;
  --mocha-subtext-0: #7f7770;
  --mocha-subtext-1: #a39992;
  --mocha-text: #eaddcf;
  --mocha-rosewater: #f3efe8;
  --mocha-blue: #7aa2c7;
  --mocha-blue-light: #8fb3d2;
  --mocha-green: #77a66a;
  --mocha-yellow: #d6a84f;
  --mocha-peach: #d98b4a;
  --mocha-red: #d65a4a;
  --mocha-pink: #d184a2;
  --mocha-mauve: #bd86c9;

  --color-background: var(--mocha-base);
  --color-widget-background: var(--mocha-surface-0);
  --color-widget-background-highlight: var(--mocha-surface-1);
  --color-widget-content-border: var(--mocha-surface-3);
  --color-separator: var(--mocha-overlay-0);
  --color-popover-background: var(--mocha-panel);
  --color-popover-border: var(--mocha-overlay-1);
  --color-progress-border: var(--mocha-overlay-0);
  --color-progress-value: var(--mocha-blue);
  --color-vertical-progress-value: var(--mocha-green);
  --color-graph-gridlines: var(--mocha-surface-3);
  --color-text-highlight: var(--mocha-rosewater);
  --color-text-paragraph: var(--mocha-text);
  --color-text-base: var(--mocha-subtext-1);
  --color-text-base-muted: var(--mocha-subtext-0);
  --color-text-subdue: var(--mocha-overlay-2);
  --border-radius: 7px;
}

html,
body {
  background: var(--mocha-base);
}

* {
  scrollbar-color: var(--mocha-overlay-1) var(--mocha-surface-0);
}

::selection {
  color: var(--mocha-base);
  background: var(--mocha-blue-light);
}

.widget {
  box-shadow: 0 1px 0 rgba(243, 239, 232, 0.04);
}

.widget-content {
  border-color: var(--mocha-surface-3);
}

.widget-header,
.bookmarks-group-title,
.color-primary,
a {
  text-decoration-color: rgba(243, 239, 232, 0.28);
}

input,
textarea,
select {
  color-scheme: dark;
}