:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, sans-serif; background: #0c111b; color: #f7f8fb; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center; background: radial-gradient(circle at top, #17243c, #0c111b 55%); }
main { width: min(100% - 32px, 560px); padding: 48px 0; }
.card { background: rgba(20, 28, 43, .94); border: 1px solid #2b3850; border-radius: 22px; padding: clamp(24px, 6vw, 44px); box-shadow: 0 28px 80px rgba(0,0,0,.35); }
.eyebrow { color: #8597b7; font-size: 12px; font-weight: 800; letter-spacing: .14em; margin: 0 0 16px; }
h1 { font-size: clamp(28px, 6vw, 40px); line-height: 1.05; margin: 0; }
.lead { color: #aebbd0; line-height: 1.55; margin: 18px 0 28px; }
form { display: grid; gap: 18px; }
label { display: grid; gap: 8px; color: #dce3ef; font-size: 14px; font-weight: 650; }
input { width: 100%; border: 1px solid #3a4963; border-radius: 12px; background: #0e1624; color: white; padding: 13px 14px; font: inherit; outline: none; }
input:focus { border-color: #7c8cff; box-shadow: 0 0 0 3px rgba(124,140,255,.16); }
button { border: 0; border-radius: 12px; padding: 14px 18px; background: #7787ff; color: white; font: inherit; font-weight: 800; cursor: pointer; margin-top: 4px; }
button:disabled { cursor: wait; opacity: .65; }
#status { display: none; margin-top: 20px; padding: 14px; border-radius: 12px; line-height: 1.45; white-space: pre-wrap; }
#status.visible { display: block; background: #111c2e; border: 1px solid #34435d; }
#status.success { border-color: #2d8262; color: #a9f1d3; }
#status.error { border-color: #a34c55; color: #ffc1c6; }
.crm-link { display: block; margin-top: 20px; color: #aebcff; font-size: 14px; font-weight: 700; text-align: center; text-decoration: none; }
.crm-link:hover { color: #d5dcff; }