* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; background: #000; overflow: hidden; }
body { font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.stage { position: relative; width: 100vw; height: 100vh; background: #000; }
video { width: 100%; height: 100%; object-fit: contain; background: #000; }
.offline {
  position: absolute; inset: 0; display: grid; place-content: center;
  text-align: center; padding: 32px; background: #090909; color: #fff;
}
.offline.hidden { display: none; }
.offline h1 { font-size: clamp(30px, 5vw, 76px); margin: 18px 0 8px; }
.offline p { font-size: clamp(16px, 2vw, 30px); opacity: .72; margin: 0; }
.badge {
  justify-self: center; padding: 8px 16px; border-radius: 999px;
  background: #e60023; font-weight: 800; letter-spacing: .12em;
}
.status {
  position: absolute; right: 18px; bottom: 18px; padding: 8px 12px;
  border-radius: 8px; background: rgba(0,0,0,.65); color: #fff;
  font-size: 14px;
}