@font-face {
  font-family: "Vagonla Sans";
  src: url("/assets/fonts/VagonlaSansVF.ttf") format("truetype");
  font-weight: 400;
  font-stretch: 100% 300%;
  font-display: swap;
}
* { box-sizing: border-box; }
html, body { margin: 0; width: 100%; height: var(--page-height, 100svh); overflow: hidden; overscroll-behavior: none; touch-action: none; background: #02050a; color: #fff; }
body { position: fixed; top: 0; left: 0; }
body { overflow: hidden; overscroll-behavior: none; touch-action: none; font-family: "Vagonla Sans", sans-serif; font-variation-settings: "wdth" 275, "oblq" 0, "grad" -100; font-synthesis: none; }
#universe { position: fixed; inset: 0; width: 100%; height: 100%; }
#interactive-stars { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; }
main { position: fixed; top: 0; left: 0; width: 100%; height: var(--page-height, 100svh); z-index: 2; display: grid; place-items: center; padding: 24px; pointer-events: none; }
h1 { pointer-events: none; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
h1 { margin: 0; text-align: center; font-size: clamp(32px, 4.1vw, 64px); font-weight: 400; font-variation-settings: "wdth" 275, "oblq" 0, "grad" -170; line-height: 1.20; letter-spacing: -.035em; text-shadow: 0 2px 5px #000, 0 0 28px #000, 0 0 65px #000; opacity: 0; transform-origin: 50% 50%; }
.line { display: block; overflow: visible; }
.line--light { font-variation-settings: "wdth" 275, "oblq" 0, "grad" -200; }
.line span { display: block; transform-origin: 50% 50%; }
.supernova-ready h1 { opacity: 1; animation: center-grow 2.2s .62s cubic-bezier(.2,.65,.25,1) both; }
.vignette { position: fixed; inset: 0; pointer-events: none; background: radial-gradient(ellipse, transparent 40%, #0005 100%); }
@keyframes center-grow {
  from { transform: scale(0); }
  to { transform: scale(1); }
}
@media (max-width: 480px) { h1 { font-size: clamp(25px, 7.8vw, 38px); } }
@media (prefers-reduced-motion: reduce) {
  h1, .supernova-ready h1, .line span, .supernova-ready .line span { animation: none; opacity: 1; transform: none; }
}