html, body {
  margin: 0;
  width: 100%;
  height: 100%;
  background: #05070d;
  color: #e5e7eb;
  font-family: Arial, sans-serif;
  overflow: hidden;
}

#topbar {
  height: 48px;
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 0 14px;
  background: #0b1220;
  border-bottom: 1px solid #1e293b;
}

#status {
  color: #38bdf8;
  font-size: 12px;
}

#topbar label{
  font-size:11px;
  color:#94a3b8;
  margin-left:8px;
}

#topbar select{
  background:#111827;
  color:#e5e7eb;
  border:1px solid #334155;
  border-radius:6px;
  padding:5px 8px;
  font-size:12px;
}

#topbar select:focus{
  outline:none;
  border-color:#38bdf8;
}

#resetWorkspace{
  background:#111827;
  color:#e5e7eb;
  border:1px solid #334155;
  border-radius:6px;
  padding:5px 8px;
  font-size:12px;
}

#topbar{
  overflow-x:auto;
  white-space:nowrap;
}

#replayControls{
  display:inline-flex;
  align-items:center;
  gap:6px;
  flex-shrink:0;
}

#replayControls input{
  background:#111827;
  color:#e5e7eb;
  border:1px solid #334155;
  border-radius:6px;
  padding:4px 6px;
  font-size:12px;
  min-width:170px;
}

#replayControls button{
  background:#111827;
  color:#e5e7eb;
  border:1px solid #334155;
  border-radius:6px;
  padding:5px 8px;
  font-size:12px;
}