/* Bänder des Betriebs (web/seiten/huelle.js betriebBaender, lib/betrieb.js) und die Wartungsseite. Alles mit bt- davor. */
.bt-baender { display: grid; gap: 0; }
.bt-band { display: flex; gap: 10px; align-items: center; justify-content: center; padding: 8px 16px; font-size: .95rem; line-height: 1.4;
  color: #fff; border-block-end: 2px solid #000; text-align: center; overflow-wrap: anywhere; }
.bt-band b { font-variant-numeric: tabular-nums; }
.bt-zeichen { flex: none; display: inline-grid; place-items: center; inline-size: 22px; block-size: 22px; background: rgb(0 0 0 / .35);
  font: 400 16px/1 var(--mc-schrift); }
.bt-info { background: #1e3a8a; }
.bt-warnung { background: #92400e; }
.bt-wartung { background: #7f1d1d; }
/* 24.09.2026 Ruhige Zeile für Leser: Wartung der Webseite läuft oder der Dienst ist kurz weg — kein Alarm, nur Bescheid */
.bt-ruhig { background: #27272a; color: #d4d4d8; font-size: .9rem; padding-block: 6px; }
/* Verwaltung (/moderation/operations): Bereiche wählen, Vorschau „Wer sieht das?" */
.bt-bereiche { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 4px 16px; }
.bt-wer { margin: 0; padding-inline-start: 18px; display: grid; gap: 4px; color: #e5e5e5; }
.bt-wer:empty { display: none; }
.bt-wer-titel { margin: 8px 0 4px; color: var(--mc-gelb); }

.bt-wartungsseite { min-block-size: 70vh; display: grid; place-items: center; padding: 40px 16px; }
.bt-kasten { max-inline-size: 640px; text-align: center; display: grid; gap: 14px; justify-items: center; }
.bt-kasten h1 { margin: 0; }
.bt-kasten p { margin: 0; color: #e5e5e5; }
.bt-uhr { font: 400 40px/48px var(--mc-schrift); color: var(--mc-gelb); }
.bt-zahnrad { inline-size: 96px; block-size: 96px; image-rendering: pixelated; animation: bt-dreh 6s linear infinite; }
@keyframes bt-dreh { to { rotate: 360deg; } }
@media (prefers-reduced-motion: reduce) { .bt-zahnrad { animation: none; } }
.bt-baender:empty { display: none; }
/* 27.09.2026 Adressen im Band sind Links (seiten/huelle.js, js/betrieb.js verlinken) */
.bt-band a { color: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
.bt-band a:hover, .bt-band a:focus-visible { text-decoration-thickness: 2px; }