:root {
  --bg: #08080a;
  --fg: #e8e6e1;
  --muted: #77756f;
  --link: #b9c6e6;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
}

html,
body {
  margin: 0;
  height: 100%;
  background: var(--bg);
  overflow: hidden;
}

a {
  color: var(--link);
  text-decoration: none;
  transition: color 0.2s ease;
}

a:hover {
  color: var(--fg);
}

.stage {
  position: relative;
  width: 100%;
  height: 100vh;
  background: var(--bg);
  overflow: hidden;
  font-family: var(--font-mono);
}

#rain {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.footer {
  position: absolute;
  left: 0;
  right: 0;
  bottom: clamp(40px, 11vh, 120px);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(16px, 2.2vh, 26px);
  pointer-events: none;
  padding: 0 24px;
}

.tagline {
  font-size: clamp(11px, 0.9vw, 14px);
  letter-spacing: 0.18em;
  color: var(--muted);
  text-transform: uppercase;
  text-align: center;
}

.links {
  display: flex;
  gap: clamp(18px, 2.2vw, 32px);
  flex-wrap: wrap;
  justify-content: center;
  font-size: clamp(11px, 0.87vw, 13.5px);
  letter-spacing: 0.1em;
  pointer-events: auto;
}