* {
  box-sizing: border-box;
}

/* define the light theme (default) */
:root {
  --bg-color: white; /* background color */
  --text-color: black; /* text color */
}

/* define the dark theme */
.dark-theme {
  --bg-color: black; /* background color */
  --text-color: white; /* text color */
}

::selection {
  background: var(--text-color); /* webkit & blink browsers */
  color: var(--bg-color);
}
::-moz-selection {
  background: var(--text-color); /* gecko browsers */
  color: var(--bg-color);
}

html {
  font-family: Roboto, sans-serif;
  font-size: 24px;
  font-weight: 500;
  text-transform: lowercase;
  background-color: var(--bg-color); /* apply variables for dark / light color scheme */
  color: var(--text-color);
  text-size-adjust: none;
  height: -webkit-fill-available;
  scroll-behavior: smooth;
  /*cursor: none;*/
}

/*
.cursor.default {
  position: absolute;
  width: 1.2rem;
  height: 1.2rem;
  border: 0.16rem solid black;
  border-radius: 50%;
}
*/

body {
  line-height: 1.2;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  padding: 0.6rem 1.2rem;
  min-height: 100vh;
}

h1 {
  font-weight: 700;
  font-size: 130%;
  margin-bottom: 1.2rem;
}

.text {
  font-size: 90%;
  margin-bottom: 0.6rem;
}

a {
  font-size: inherit;
  color: inherit;
  text-decoration: none;
  cursor: crosshair;
}

a[target="_blank"] {
  cursor: alias;
}

.inline-link {
  text-decoration: underline;
}

.inline-link:hover {
  text-decoration: none;
}