.runtime-banner {
  position: sticky;
  top: 0;
  z-index: 1000;
  width: 100%;
  overflow: hidden;
  border-bottom: 1px solid #d97706;
  background: #fef3c7;
  color: #78350f;
  font-weight: 800;
  line-height: 38px;
}

.runtime-banner.locked {
  border-color: #991b1b;
  background: #fee2e2;
  color: #7f1d1d;
}

.runtime-banner-track {
  width: max-content;
  min-width: 100%;
  white-space: nowrap;
  animation: runtime-banner-scroll 18s linear infinite;
}

.runtime-banner-text {
  display: inline-block;
  min-width: 100vw;
  padding: 0 32px;
  text-align: center;
}

.runtime-locked .workspace,
.runtime-locked main {
  filter: grayscale(.35);
}

.runtime-locked #annotationCanvas {
  pointer-events: none;
  cursor: not-allowed;
}

@keyframes runtime-banner-scroll {
  from { transform: translateX(100vw); }
  to { transform: translateX(-100%); }
}

@media (prefers-reduced-motion: reduce) {
  .runtime-banner-track {
    width: 100%;
    animation: none;
  }
}
