:root {
  color-scheme: light;
  --kitix-paper: #f6f2e9;
  --kitix-ink: #161511;
  --kitix-body: #403d37;
  --kitix-muted: #6b675f;
  --kitix-rule: #bdb6aa;
  --kitix-control-rule: #847e73;
  --kitix-violet: #5140e8;
  --kitix-lime: #d8fb39;
  --kitix-error: #b42318;
  --kitix-hover: #eee9df;
  --kitix-font-sans:
    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif;
  --kitix-font-mono:
    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
    "Courier New", monospace;
  background: var(--kitix-paper);
  color: var(--kitix-ink);
  font-family: var(--kitix-font-sans);
}

@media screen {
  html,
  body,
  #root {
    min-height: 100%;
    background: var(--kitix-paper);
  }

  body {
    color: var(--kitix-ink);
    font-family: var(--kitix-font-sans);
  }

  ::selection {
    background: var(--kitix-lime);
    color: var(--kitix-ink);
  }

  :focus-visible {
    outline: 3px solid var(--kitix-violet);
    outline-offset: 3px;
  }
}