timer function in Interface?

Try something like this. The important part is, that you cannot make this work without a user interaction.

a!localVariables(
  local!status: true,
  local!show: a!refreshVariable(
    value: local!status,
    refreshOnReferencedVarChange: false,
    refreshInterval: 0.5
  ),
  {
    a!buttonArrayLayout(
      buttons: {
        a!buttonWidget(
          label: "hide",
          value: false,
          saveInto: local!status
        )
      }
    ),
    a!cardLayout(
      contents: {},
      height: "AUTO",
      style: "SUCCESS",
      marginBelow: "STANDARD",
      showWhen: local!show
    )
  }
)

Thank you.

I hope there is a way to make this work without a user interaction.

You can achieve that without user interaction:
There is a small issue, it's not exactly 30 seconds, because when you set the refreshInterval as 0.5, it is not exactly 30 seconds, but somewhere around it. From some tests I did, it's around 25 seconds.

a!localVariables(
  local!timeFlag: now() + second() * 15,
  local!show: a!refreshVariable(
    value: now() < local!timeFlag,
    refreshInterval: 0.5
  ),
  a!cardLayout(
    showWhen: local!show,
    style: "WARN"
  )
)

Hm ... as simple as this is, I did not think of it. Thanks a lot :-)

Yeah, I tried it too and it seems to work fine.  I would've guessed, though, because I already have a similar functionality in place on some of my interfaces to "expire" a document download link for an exported report that I have the process auto-delete after an hour has elapsed.