:root {
  color-scheme: dark;
  --bg: #111218;
  --fg: #e8e6f0;
  --muted: #8b8a99;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--bg);
  color: var(--fg);
  font-family: ui-sans-serif, system-ui, "Segoe UI", Roboto, sans-serif;
}
main {
  position: relative;
  flex: 1;
  display: grid;
  place-content: center;
  gap: 18px;
  padding: 24px;
  text-align: center;
  overflow: hidden;
}
/* a slow violet glow behind the name */
main::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(720px, 120vw);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(124, 92, 255, 0.22), transparent);
  transform: translate(-50%, -50%);
  animation: breathe 8s ease-in-out infinite;
  pointer-events: none;
}
h1 {
  position: relative;
  font-size: clamp(3.2rem, 13vw, 8.5rem);
  font-weight: 800;
  letter-spacing: -0.045em;
  line-height: 1;
}
h1.small { font-size: clamp(2rem, 7vw, 3.5rem); }
p {
  position: relative;
  color: var(--muted);
  font-size: clamp(1rem, 2.4vw, 1.2rem);
}
a { color: var(--fg); }
footer {
  padding: 20px;
  text-align: center;
  color: #55545f;
  font-size: 0.8rem;
}
@keyframes breathe {
  0%, 100% { transform: translate(-50%, -50%) scale(0.92); opacity: 0.75; }
  50% { transform: translate(-50%, -50%) scale(1.06); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  main::before { animation: none; }
}