:root {
  --bg: #020803;
  --ink: #4af68a;
  --ink-dim: #1d5c36;
  --mono: ui-monospace, "JetBrains Mono", "SF Mono", Menlo, monospace;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

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

.stage { position: relative; height: 100%; overflow: hidden; }

#view { display: block; width: 100%; height: 100%; }

.hud {
  position: absolute; left: 0; right: 0;
  display: flex; align-items: center; justify-content: center; gap: 18px;
  font-family: var(--mono); color: var(--ink);
  letter-spacing: 0.14em; font-size: 13px;
  text-shadow: 0 0 8px rgba(74, 246, 138, 0.5);
  pointer-events: none;
}

.hud-top { top: 22px; }
.hud-bottom { bottom: 18px; }

.headline { font-size: 15px; font-weight: 700; }

.status { color: var(--ink-dim); }
.status.live { color: var(--ink); }