/* Estrutura das telas. Só var(--…). */
.shell {
  display: flex;
  flex-direction: column;
  gap: var(--s-4);
  max-width: 560px;
  margin: 0 auto;
  padding-top: var(--s-4);
}

.shell__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-3);
}

.screen {
  display: flex;
  flex-direction: column;
  gap: var(--s-4);
}

.screen__title {
  font-size: var(--fs-heading);
}

.screen__lead {
  color: var(--text-2);
}

/* Fora do Telegram */
.gate {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--s-4);
  max-width: 420px;
  min-height: calc(var(--app-height) - var(--s-6));
  margin: 0 auto;
  justify-content: center;
  text-align: center;
}

.gate__title {
  font-size: var(--fs-heading);
}

.gate__text {
  color: var(--text-2);
}