// inline - light
body {
  --theme-ui-colors-text: var(--theme-ui-colors-text, #000);
  --theme-ui-colors-background: var(--theme-ui-colors-background, #fff);
  --theme-ui-colors-primary: var(--theme-ui-colors-primary, #33e);
  --theme-ui-colors-secondary: var(--theme-ui-colors-secondary, #119);
  --theme-ui-colors-muted: var(--theme-ui-colors-muted, #f6f6f6);
  --theme-ui-colors-highlight: var(--theme-ui-colors-highlight, #efeffe);
  --theme-ui-colors-gray: var(--theme-ui-colors-gray, #777);
  --theme-ui-colors-accent: var(--theme-ui-colors-accent, #609);
  --theme-ui-colors-darken: var(--theme-ui-colors-darken, rgba(0, 0, 0, .25));
  color: var(--theme-ui-colors-text, #000);
  background-color: var(--theme-ui-colors-background, #fff);
}

// inline - dark
body {
  --theme-ui-colors-text: var(--theme-ui-colors-text, #fff);
  --theme-ui-colors-background: var(--theme-ui-colors-background, #060606);
  --theme-ui-colors-primary: var(--theme-ui-colors-primary, #3cf);
  --theme-ui-colors-secondary: var(--theme-ui-colors-secondary, #e0f);
  --theme-ui-colors-muted: var(--theme-ui-colors-muted, #191919);
  --theme-ui-colors-highlight: var(--theme-ui-colors-highlight, #29112c);
  --theme-ui-colors-gray: var(--theme-ui-colors-gray, #999);
  --theme-ui-colors-accent: var(--theme-ui-colors-accent, #c0f);
  --theme-ui-colors-darken: var(--theme-ui-colors-darken, rgba(0, 0, 0, .25));
  color: var(--theme-ui-colors-text, #fff);
  background-color: var(--theme-ui-colors-background, #060606);
}

// inline - deep
body {
  --theme-ui-colors-text: var(--theme-ui-colors-text, hsl(210, 50%, 96%));
  --theme-ui-colors-background: var(--theme-ui-colors-background, hsl(230, 25%, 18%));
  --theme-ui-colors-primary: var(--theme-ui-colors-primary, hsl(260, 100%, 80%));
  --theme-ui-colors-secondary: var(--theme-ui-colors-secondary, hsl(290, 100%, 80%));
  --theme-ui-colors-muted: var(--theme-ui-colors-muted, hsla(230, 20%, 0%, 0.2));
  --theme-ui-colors-highlight: var(--theme-ui-colors-highlight, hsl(260, 20%, 40%));
  --theme-ui-colors-gray: var(--theme-ui-colors-gray, hsl(210, 50%, 60%));
  --theme-ui-colors-accent: var(--theme-ui-colors-accent, hsl(290, 100%, 80%));
  --theme-ui-colors-darken: var(--theme-ui-colors-darken, rgba(0, 0, 0, .25));
  color: var(--theme-ui-colors-text, hsl(210, 50%, 96%));
  background-color: var(--theme-ui-colors-background, hsl(230, 25%, 18%));
}

// inline -swiss
body {
  --theme-ui-colors-text: var(--theme-ui-colors-text, hsl(10, 20%, 20%));
  --theme-ui-colors-background: var(--theme-ui-colors-background, hsl(10, 10%, 98%));
  --theme-ui-colors-primary: var(--theme-ui-colors-primary, hsl(10, 80%, 50%));
  --theme-ui-colors-secondary: var(--theme-ui-colors-secondary, hsl(10, 60%, 50%));
  --theme-ui-colors-muted: var(--theme-ui-colors-muted, hsl(10, 20%, 94%));
  --theme-ui-colors-highlight: var(--theme-ui-colors-highlight, hsl(10, 40%, 90%));
  --theme-ui-colors-gray: var(--theme-ui-colors-gray, hsl(10, 20%, 50%));
  --theme-ui-colors-accent: var(--theme-ui-colors-accent, hsl(250, 60%, 30%));
  --theme-ui-colors-darken: var(--theme-ui-colors-darken, rgba(0, 0, 0, .25));
  color: var(--theme-ui-colors-text, hsl(10, 20%, 20%));
  background-color: var(--theme-ui-colors-background, hsl(10, 10%, 98%));
}
