:root {
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #030712;
}

* {
  box-sizing: border-box;
}

html,
body {
  min-height: 100%;
  margin: 0;
}

body {
  min-height: 100vh;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 46%, rgb(37 99 235 / 14%), transparent 38rem),
    #030712;
}

.host-identity {
  display: grid;
  min-height: 100vh;
  place-items: center;
  padding: 2rem;
}

.wordmark {
  margin: 0;
  color: #dbeafe;
  font-size: clamp(3rem, 11vw, 9rem);
  font-weight: 750;
  letter-spacing: -0.065em;
  line-height: 0.92;
  background: linear-gradient(105deg, #2563eb 8%, #60a5fa 31%, #ffffff 50%, #93c5fd 69%, #2563eb 92%);
  background-size: 240% 100%;
  background-position: 0% 50%;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 0 1.5rem rgb(59 130 246 / 28%));
  animation: wordmark-pulse 5.8s ease-in-out infinite;
}

@keyframes wordmark-pulse {
  0%,
  100% {
    background-position: 0% 50%;
    filter: drop-shadow(0 0 1rem rgb(37 99 235 / 20%));
    transform: scale(0.99);
  }

  50% {
    background-position: 100% 50%;
    filter: drop-shadow(0 0 2.2rem rgb(147 197 253 / 42%));
    transform: scale(1.01);
  }
}

@media (prefers-reduced-motion: reduce) {
  .wordmark {
    animation: none;
    background-position: 50% 50%;
    transform: none;
  }
}