body {
  margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 24px;
  background: radial-gradient(ellipse at 50% 30%, #0C2A3D, #030A12 70%);
  color: #D6F3FF; font: 500 18px/1.6 system-ui, sans-serif;
}
main { max-width: 34rem; text-align: center; }
h1 { margin: 24px 0 12px; font-size: clamp(28px, 6vw, 44px); line-height: 1.1; letter-spacing: 0.02em; }
p { color: #9CC3D6; }
code { color: #4FD8FF; }
.small { font-size: 15px; color: #6F98AE; }
.orb {
  width: 90px; height: 90px; margin: 0 auto; border-radius: 50%;
  border: 3px solid #4FD8FF; box-shadow: 0 0 30px #4FD8FF, inset 0 0 30px #4FD8FF;
  animation: breathe 3s ease-in-out infinite;
}
@keyframes breathe { 50% { box-shadow: 0 0 50px #4FD8FF, inset 0 0 40px #4FD8FF; } }
@media (prefers-reduced-motion: reduce) { .orb { animation: none; } }