:root {
  color-scheme: dark;
  --bg: #07090d;
  --ink: #f4f1ea;
  --muted: #9a9588;
  --line: rgba(244, 241, 234, 0.12);
  --amber: #d6a24a;
}
* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0;
  font-family: "Segoe UI", "Helvetica Neue", system-ui, sans-serif;
  background: var(--bg);
  color: var(--ink);
  overflow: hidden;
}
.grid {
  position: fixed;
  inset: 0;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(ellipse at center, black 35%, transparent 78%);
  pointer-events: none;
}
.scan {
  position: fixed;
  inset: 0;
  background: repeating-linear-gradient(
    to bottom,
    transparent 0,
    transparent 2px,
    rgba(0, 0, 0, 0.18) 3px
  );
  pointer-events: none;
  opacity: 0.35;
}
.vignette {
  position: fixed;
  inset: 0;
  background: radial-gradient(ellipse at center, transparent 40%, rgba(0, 0, 0, 0.55) 100%);
  pointer-events: none;
}
main {
  min-height: 100%;
  display: grid;
  place-items: center;
  padding: 2rem;
  position: relative;
  z-index: 1;
}
.frame {
  text-align: center;
  max-width: 52rem;
}
.meta {
  font-family: ui-monospace, "Cascadia Mono", "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: 0.72rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--amber);
  margin: 0 0 1.75rem;
}
h1 {
  margin: 0;
  font-size: clamp(3.1rem, 12vw, 8.5rem);
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 0.92;
  text-transform: uppercase;
}
.soon {
  margin: 1.4rem 0 0;
  font-family: ui-monospace, "Cascadia Mono", "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: clamp(0.95rem, 2.4vw, 1.25rem);
  font-weight: 400;
  letter-spacing: 0.42em;
  text-transform: lowercase;
  color: var(--muted);
}
.rule {
  width: min(18rem, 70vw);
  height: 1px;
  margin: 1.35rem auto 0;
  background: linear-gradient(90deg, transparent, var(--amber), transparent);
  opacity: 0.85;
}
.cursor {
  display: inline-block;
  width: 0.55em;
  height: 1em;
  margin-left: 0.12em;
  background: var(--amber);
  transform: translateY(0.12em);
  animation: blink 1.1s steps(1) infinite;
}
@keyframes blink {
  50% { opacity: 0; }
}