:root {
  color-scheme: dark;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", system-ui, sans-serif;
  background: #070708;
  color: #f7f5fa;
}
* { box-sizing: border-box; }
html, body { min-width: 320px; min-height: 100%; margin: 0; background: #070708; }
body { min-height: 100svh; }
.page { position: relative; min-height: 100svh; overflow-x: clip; isolation: isolate; }
.page::before {
  position: fixed;
  z-index: -1;
  inset: -30% 28% 42% -25%;
  border-radius: 50%;
  background: rgba(88, 48, 188, 0.2);
  filter: blur(140px);
  content: "";
}
header, main, footer { width: min(calc(100% - 3rem), 720px); margin-inline: auto; }
header { padding-top: clamp(1.5rem, 4vw, 2.5rem); }
header a { color: rgba(247, 245, 250, 0.68); font-size: 0.95rem; font-weight: 560; text-decoration: none; }
main { padding: clamp(3rem, 7vh, 5rem) 0 3rem; }
h1 { margin: 0 0 1.5rem; font-size: clamp(2rem, 6vw, 3.3rem); font-weight: 560; letter-spacing: -0.035em; line-height: 1.1; text-wrap: balance; }
h2 { margin: 2rem 0 0.65rem; font-size: 1.25rem; font-weight: 600; line-height: 1.3; }
p, li { color: rgba(247, 245, 250, 0.8); font-size: 1.0625rem; line-height: 1.7; }
p { margin: 0 0 1.25rem; }
ul { margin: 0; padding-left: 1.4rem; }
li { padding-left: 0.15rem; margin-bottom: 1rem; }
strong { color: #f7f5fa; font-weight: 600; }
.updated { color: rgba(247, 245, 250, 0.62); font-size: 0.95rem; margin-bottom: 1.75rem; }
a { color: #d8ceff; text-underline-offset: 0.18em; }
a:hover, a:focus-visible { color: #fff; }
a:focus-visible { outline: 2px solid #d8ceff; outline-offset: 3px; }
footer { padding-bottom: 2rem; color: rgba(247, 245, 250, 0.62); font-size: 0.95rem; }
nav { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; }
nav a { display: inline-flex; align-items: center; min-height: 2.75rem; }
nav a[aria-current="page"] { color: #f7f5fa; }
@media (max-width: 520px) {
  header, main, footer { width: min(calc(100% - 2.5rem), 720px); }
  main { padding-top: 3rem; }
}