:root { color-scheme: dark; --ink:#f7f5ef; --muted:#a8adbb; --accent:#a5ff3d; --panel:#171b26; }
* { box-sizing: border-box; }
[hidden] { display:none !important; }
body { margin:0; min-height:100vh; color:var(--ink); background:#0d0f15; font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; background:radial-gradient(circle at 80% 20%,#38256866,transparent 30%),radial-gradient(circle at 15% 85%,#1b5a4844,transparent 28%); }
main { position:relative; width:min(1060px,calc(100% - 40px)); min-height:100vh; margin:auto; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:80px; padding:72px 0; }
.eyebrow,.label { font-size:12px; letter-spacing:.18em; font-weight:800; color:var(--accent); }
h1 { margin:14px 0 24px; font-size:clamp(64px,8vw,108px); line-height:.82; letter-spacing:-.07em; }
h1 span { color:transparent; -webkit-text-stroke:1px #71798d; }
.hero p { color:var(--muted); font-size:18px; line-height:1.65; max-width:470px; }
.card { padding:32px; border:1px solid #2b3040; border-radius:22px; background:linear-gradient(145deg,#1c202cdd,#11141ddd); box-shadow:0 30px 80px #0008; backdrop-filter:blur(18px); }
.status-row { display:flex; align-items:center; justify-content:space-between; }
h2 { margin:8px 0 0; font-size:28px; }
.pulse { width:16px; height:16px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 9px #a5ff3d18,0 0 28px #a5ff3d99; }
.pulse.error { background:#ff5964; box-shadow:0 0 0 9px #ff596418,0 0 28px #ff596499; }
.pulse.waiting { background:#ffce55; box-shadow:none; }
.stats { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:#303544; margin:30px 0; border:1px solid #303544; border-radius:13px; overflow:hidden; }
.stats div { background:#141822; padding:20px 14px; }
.stats span { display:block; font-size:21px; font-weight:750; }
.stats small { display:block; color:#7f879a; font-size:9px; margin-top:7px; letter-spacing:.13em; }
.details { min-height:50px; color:var(--muted); line-height:1.5; font-size:14px; }
button { margin-top:22px; width:100%; border:0; border-radius:12px; padding:15px 18px; color:#11160b; background:var(--accent); font:inherit; font-weight:800; cursor:pointer; display:flex; justify-content:space-between; }
button:disabled { opacity:.5; cursor:wait; }
form { border-top:1px solid #303544; margin-top:28px; padding-top:28px; }
.form-heading { margin-bottom:20px; }
h3 { margin:6px 0 0; font-size:22px; }
label { display:block; color:#aeb5c5; font-size:12px; margin:14px 0; }
input { display:block; width:100%; margin-top:7px; border:1px solid #343a4a; border-radius:9px; padding:12px 13px; background:#0f131c; color:#f7f5ef; font:inherit; font-size:13px; outline:none; }
input:focus { border-color:#8cd934; box-shadow:0 0 0 3px #a5ff3d16; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.privacy { color:#747c90; font-size:11px; line-height:1.5; }
footer { position:absolute; bottom:28px; left:0; color:#656c7e; font-size:12px; }
@media (max-width:760px) { main { grid-template-columns:1fr; gap:34px; align-content:center; padding:50px 0 90px; } h1 { font-size:66px; } .form-grid { grid-template-columns:1fr; gap:0; } footer { bottom:22px; } }
