*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  --bg: #111111;
  --fg: #E8E8E8;
  --font: 'Commit Mono', Menlo, 'Courier New', monospace;
}

html {
  font-size: 16px;
}

body {
  background-color: var(--bg);
  color: var(--fg);
  font-family: var(--font);
  font-size: 1rem;
  line-height: 1.6;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  padding: 4rem 3rem;
  -webkit-font-smoothing: antialiased;
}

main {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.wordmark {
  width: min(280px, 100%);
  height: auto;
  margin-bottom: 3rem;
}

.tagline {
  margin-bottom: 1rem;
}

.status {
  opacity: 0.45;
}

footer {
  margin-top: 4rem;
  opacity: 0.35;
  font-size: 0.8125rem;
}

@media (max-width: 480px) {
  body {
    padding: 3rem 1.5rem;
  }
}