:root { color-scheme: dark; --grund:#101312; --text:#e7ece9; --leise:#9aa5a0; --akzent:#7fc29b; --rot:#e06c5f; }
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--grund); color: var(--text);
  font: 16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
main { max-width: 1280px; margin: 0 auto; padding: 16px; }
header { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
h1 { margin: 0; font-size: 1.4rem; font-weight: 600; }
.status { font-size: .9rem; color: var(--leise); }
.status.live { color: var(--akzent); }
.status.live::before { content: "\25CF  "; }
.status.weg { color: var(--rot); }
.buehne { background: #000; border-radius: 8px; overflow: hidden; aspect-ratio: 16 / 9; }
video { width: 100%; height: 100%; display: block; background: #000; }
.leiste { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 12px; }
button { background: #1d2422; color: var(--text); border: 1px solid #2f3a36; border-radius: 6px;
  padding: 8px 14px; font: inherit; cursor: pointer; }
button:hover { border-color: var(--akzent); }
.hinweis { color: var(--leise); font-size: .9rem; }