:root {
  --bg: var(--tg-theme-bg-color, #ffffff);
  --text: var(--tg-theme-text-color, #000000);
  --hint: var(--tg-theme-hint-color, #707579);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background: var(--bg);
  color: var(--text);
  -webkit-tap-highlight-color: transparent;
}

#app {
  max-width: 420px;
  margin: 0 auto;
  padding: 32px 20px 40px;
  text-align: center;
}

h1 { font-size: 20px; margin: 8px 0 6px; }

#instruction { color: var(--hint); margin: 0 0 28px; font-size: 15px; }

#widget {
  display: flex;
  justify-content: center;
  min-height: 70px;
}

.status { margin-top: 24px; font-size: 15px; min-height: 22px; }
.status.error { color: #e53935; }
.status.success { color: #2e7d32; }