:root{
  --bg-1:#0b0f14; --bg-2:#111826; --bg-3:#0b1320;
  --txt:#eaf1f9; --muted:#a8b6c9;
  --accent:#58a6ff; --accent2:#39d0a3;
}
*{box-sizing:border-box}
html,body{height:100%;}
html,body{margin:0;background:var(--bg-1);color:var(--txt);font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Helvetica,Arial,sans-serif}
.bg{
  position:fixed;inset:0;
  background:
    radial-gradient(1200px 600px at 20% 10%, rgba(88,166,255,.12), transparent 60%),
    radial-gradient(1000px 500px at 80% 30%, rgba(57,208,163,.10), transparent 60%),
    radial-gradient(900px 500px at 50% 90%, rgba(88,166,255,.08), transparent 60%),
    linear-gradient(180deg, var(--bg-2), var(--bg-1) 40%, var(--bg-3));
  animation: glow 14s ease-in-out infinite alternate;
  filter: saturate(1.1);
}
@keyframes glow{
  0%{ filter: hue-rotate(0deg) saturate(1.05); }
  100%{ filter: hue-rotate(10deg) saturate(1.25); }
}
.center{
  min-height:100%;
  display:grid; place-items:center;
  padding:40px 16px;
}
.mark{ text-align:center; }
.logo{ width:84px; height:84px; margin:0 auto 14px; opacity:.95; }
.wordmark{ margin:0 0 6px; font-weight:800; letter-spacing:.5px; font-size:44px; }
.tagline{ margin:0; color:var(--muted); font-weight:500; letter-spacing:.2px }
.footer{
  position:fixed; left:0; right:0; bottom:0;
  text-align:center; color:#9fb0c7; font-size:12px; padding:10px 6px;
  background: linear-gradient(180deg, transparent, rgba(0,0,0,.2));
  backdrop-filter: blur(1px);
}

/* Respect prefers-reduced-motion */
@media (prefers-reduced-motion: reduce){
  .bg{ animation: none; }
}