:root {
  color-scheme: dark;
  font:
    17px/1.7 system-ui,
    sans-serif;
  color: #edf3fa;
  background: #142238;
}
body {
  margin: 0 auto;
  padding: 28px 22px 60px;
  max-width: 850px;
}
header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 24px;
  border-bottom: 1px solid #51647d;
}
nav {
  display: flex;
  gap: 18px;
}
a {
  color: #dcfb76;
  overflow-wrap: anywhere;
  text-underline-offset: 4px;
}
a:focus-visible {
  outline: 2px solid #dcfb76;
  outline-offset: 5px;
}
[aria-current] {
  font-weight: bold;
}
h1 {
  font-size: clamp(1.8rem, 5vw, 2.8rem);
  line-height: 1.15;
}
h2 {
  margin: 30px 0 10px;
  font-size: 1.2rem;
}
p {
  margin: 10px 0;
}
time {
  color: #b0c2d6;
}
[hidden] {
  display: none !important;
}