html {
  --background-color: #121212;
  --background-color-l1: #1e1e1e;
  --background-color-l2: #2e2e2e;
  --background-color-l3: #3e3e3e;
  --background-color-l4: #4e4e4e;
  --background-color-l5: #686868;
  --accent-color: #3367d6;
  --danger-color: #d9534f;
  --medium-color: #d9c74f;
  --good-color: #5fd94f;
  --text-color: #e0e0e0;
  --disabled-text-color: #b0b0b0;
}

body {
  margin: 10px 0px 10px 0px;
  padding: 0;
  font-family: sans-serif;
  height: calc(100vh - 20px - 60px /* header */);
  background-color: var(--background-color);
}

body * {
  /* Material Design recommended font stack */
  font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI",
    Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
    "Segoe UI Symbol";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings: "wdth" 100;
  vertical-align: middle;
}