:root {
  --navy: #081522;
  --cyan: #29D5E7;
  --teal: #26C6DA;
  --violet: #B55CDB;
  --ice: #F0F8FF;
}
* { box-sizing: border-box; margin: 0; }
html, body { height: 100%; }
body {
  min-height: 100%;
  display: grid;
  grid-template-rows: 1fr auto;
  place-items: center;
  padding: 24px 16px;
  background:
    radial-gradient(60rem 40rem at 15% 10%, rgba(41, 213, 231, 0.10), transparent 60%),
    radial-gradient(50rem 35rem at 90% 90%, rgba(181, 92, 219, 0.10), transparent 60%),
    linear-gradient(rgba(41, 213, 231, 0.05) 1px, transparent 1px) 0 0 / 48px 48px,
    linear-gradient(90deg, rgba(41, 213, 231, 0.05) 1px, transparent 1px) 0 0 / 48px 48px,
    var(--navy);
  color: var(--ice);
  font-family: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
}
.panel {
  width: min(100%, 520px);
  padding: 48px 40px;
  text-align: center;
  border: 1px solid rgba(41, 213, 231, 0.25);
  border-radius: 16px;
  background: rgba(240, 248, 255, 0.03);
  box-shadow: 0 0 0 1px rgba(8, 21, 34, 0.6), 0 24px 64px rgba(0, 0, 0, 0.45), 0 0 48px rgba(41, 213, 231, 0.08);
  backdrop-filter: blur(8px);
}
.eyebrow {
  font-size: 0.75rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--teal);
}
h1 {
  margin-top: 12px;
  font-size: clamp(2rem, 6vw, 2.75rem);
  font-weight: 600;
  letter-spacing: 0.02em;
}
h1 span {
  background: linear-gradient(90deg, var(--cyan), var(--violet));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.tagline {
  margin-top: 8px;
  font-size: 1.05rem;
  color: rgba(240, 248, 255, 0.75);
}
.status {
  margin-top: 32px;
  font-size: 0.9rem;
  color: rgba(240, 248, 255, 0.6);
}
.dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 8px;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 10px var(--cyan);
  animation: pulse 2.4s ease-in-out infinite;
}
footer {
  font-size: 0.8rem;
  color: rgba(240, 248, 255, 0.45);
  letter-spacing: 0.05em;
}
@keyframes pulse { 50% { opacity: 0.35; } }
@media (prefers-reduced-motion: reduce) { .dot { animation: none; } }