body {
  background: #f5f5f7;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  padding-bottom: 120px;
}

.page-header {
  text-align: center;
  padding: 1.5rem 1rem 1rem;
}

.page-header h1 {
  font-weight: 600;
  letter-spacing: 0.02em;
}

.card-apple {
  background: #fff;
  border: none;
  border-radius: 1.5rem;
  box-shadow: 0 8px 30px rgba(0,0,0,0.05);
}

input.text-uppercase {
  text-transform: uppercase;
}

.btn-apple {
  border-radius: 999px;
  font-weight: 600;
  padding: 0.6rem 1.4rem;
}

#msgBox {
  position: fixed;
  bottom: 1rem;
  left: 50%;
  transform: translateX(-50%);
  width: min(90%, 600px);
  z-index: 9999;
}

@media (min-width: 768px) {
  .form-row-flex {
    display: flex;
    gap: 1rem;
  }
  .form-row-flex .flex-item {
    flex: 1;
  }
}