* { box-sizing: border-box; }
:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, sans-serif; }
body {
  min-height: 100vh; margin: 0; display: grid; place-items: center; padding: 24px;
  color: #f7f8ff; background: radial-gradient(circle at top, #243b68, #090d18 65%);
}
.card {
  width: min(680px, 100%); padding: clamp(28px, 7vw, 64px); border: 1px solid #ffffff24;
  border-radius: 28px; background: #111827cc; box-shadow: 0 30px 80px #0008;
}
.eyebrow { color: #7dd3fc; font-size: .78rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
h1 { margin: 12px 0; font-size: clamp(2.3rem, 10vw, 5rem); line-height: .95; overflow-wrap: anywhere; }
p { color: #cbd5e1; font-size: clamp(1rem, 2vw, 1.15rem); line-height: 1.65; }
button {
  margin-top: 18px; border: 0; border-radius: 999px; padding: 13px 20px; cursor: pointer;
  color: #07111f; background: #7dd3fc; font: inherit; font-weight: 800;
}
button:hover { background: #bae6fd; }
button:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.message { min-height: 1.65em; margin-bottom: 0; }