:root {
  --theme-color: rgb(240, 240, 240);
  --primary-color: rgb(30, 30, 31);
  --secondary-color: rgb(96, 96, 98);
  --link-color: #007bff;
  --header-footer-height: 60px;
  --border-color: #ddd;
}

body {
  color: var(--primary-color);
  background-color: var(--theme-color);
  font-size: 18px;
  font-family:
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Oxygen,
    Ubuntu,
    Cantarell,
    "Open Sans",
    "Helvetica Neue",
    sans-serif;
}

header,
footer {
  text-align: center;
  height: var(--header-footer-height);
  display: flex;
  justify-content: center;
  align-items: center;
}

footer {
  font-size: 14px;
  color: var(--secondary-color);
}

a {
  text-decoration: underline;
  color: var(--link-color);
}

input {
  border: 1px solid #ccc;
  border-radius: 6px;
  background-color: white;
  padding: 2px 4px;
  font-size: 16px;
}

.hidden {
  opacity: 0 !important;
  pointer-events: none !important;
}