:root {
  --bg-dark: hsl(228, 79%, 2%);
  --bg: hsl(222, 55%, 5%);
  --bg-light: hsl(220, 35%, 10%);
  --text: hsl(220, 100%, 98%);
  --text-muted: hsl(220, 35%, 73%);
  --highlight: hsl(220, 20%, 42%);
  --border: hsl(220, 26%, 31%);
  --border-muted: hsl(220, 37%, 20%);
  --primary: hsl(220, 78%, 76%);
  --secondary: hsl(40, 53%, 60%);
  --danger: hsl(9, 50%, 64%);
  --warning: hsl(52, 40%, 57%);
  --success: hsl(146, 30%, 59%);
  --info: hsl(217, 40%, 65%);
}

body.light {
  --bg-dark: hsl(220, 59%, 91%);
  --bg: hsl(220, 100%, 97%);
  --bg-light: hsl(220, 100%, 100%);
  --text: hsl(226, 85%, 7%);
  --text-muted: hsl(220, 26%, 31%);
  --highlight: hsl(220, 100%, 100%);
  --border: hsl(220, 19%, 53%);
  --border-muted: hsl(220, 27%, 65%);
  --primary: hsl(221, 70%, 70%);
  --secondary: hsl(44, 80%, 50%);
  --danger: hsl(9, 50%, 50%);
  --warning: hsl(52, 60%, 60%);
  --success: hsl(147, 90%, 50%);
  --info: hsl(217, 70%, 60%);
}

body {
  background-color: var(--bg-light);
  color: var(--text-muted);
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

/*# sourceMappingURL=style.css.map */