:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif; }
body { margin: 0; background: radial-gradient(circle at 20% 10%, #183b6b, transparent 35%), #070a12; color: #eef4ff; }
main { max-width: 980px; margin: 0 auto; padding: 64px 20px; }
.hero { padding: 56px 0; }
.pill { display: inline-block; padding: 8px 12px; border: 1px solid #274263; border-radius: 999px; color: #9fc7ff; background: #0d1726; }
h1 { font-size: clamp(42px, 7vw, 76px); line-height: .92; margin: 22px 0; letter-spacing: -0.06em; }
p { color: #b8c4d8; font-size: 18px; max-width: 650px; }
form { display: flex; gap: 10px; margin-top: 28px; max-width: 620px; }
input { flex: 1; padding: 16px 18px; border-radius: 14px; border: 1px solid #27364f; background: #0b111d; color: white; font-size: 16px; }
button { padding: 16px 22px; border: 0; border-radius: 14px; background: #4da3ff; color: #031022; font-weight: 800; cursor: pointer; }
.fine { font-size: 13px; color: #7f8da3; }
.panel { border: 1px solid #1d2b42; background: rgba(9, 15, 27, .76); border-radius: 24px; padding: 24px; }
pre { white-space: pre-wrap; color: #d8e7ff; font-size: 14px; line-height: 1.5; }
@media (max-width: 640px) { form { flex-direction: column; } }