/* Live mode: a bare full-screen canvas with a small panel that hides itself. */
html, body { margin: 0; height: 100%; overflow: hidden; background: #050a1f; color: #eef1f7; font: 14px/1.45 system-ui, -apple-system, "Segoe UI", sans-serif; }
#liveStage { position: fixed; inset: 0; width: 100vw; height: 100vh; display: block; }
.live-panel { position: fixed; left: 16px; bottom: 16px; max-width: min(420px, calc(100vw - 32px)); padding: 16px 18px; border-radius: 16px;
  background: rgba(8, 12, 30, .78); border: 1px solid rgba(255,255,255,.1); backdrop-filter: blur(10px); transition: opacity .4s; }
.live-panel.is-hidden { opacity: 0; pointer-events: none; }
.live-logo img { display: block; }
.live-lede { margin: 10px 0 12px; color: #c4cbe0; }
.live-btns { display: flex; flex-wrap: wrap; gap: 8px; }
.live-btns button { font: inherit; padding: 9px 14px; border-radius: 999px; border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.06); color: inherit; cursor: pointer; }
.live-btns button:hover { border-color: #00ceff; }
.live-btns button:first-child { background: linear-gradient(90deg, #00ceff, #1553e6); border-color: transparent; color: #fff; }
.live-status { margin: 10px 0 0; font-size: 13px; color: #8be3b3; }
.live-obs { margin: 8px 0 0; font-size: 12px; color: #8b95ad; }