:root{--bg:#07090f;--panel:#10131c;--panel-2:#151925;--line:#252a38;--text:#f6f7fb;--muted:#8f96a8;--violet:#8b5cf6;--cyan:#22d3ee;--green:#34d399;--amber:#fbbf24;--danger:#fb7185}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 50% -20%,#20213c 0,transparent 37%),var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;min-height:100vh}.topbar{height:72px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1200px)/2));background:#090b11cc;backdrop-filter:blur(14px);position:sticky;top:0;z-index:10}.brand{display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none;font-size:18px}.brand b{color:#a78bfa}.brand-mark{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font:bold 18px Syne;background:linear-gradient(135deg,#a78bfa,#6d28d9);box-shadow:0 0 30px #8b5cf655}.top-actions{display:flex;gap:12px;align-items:center}.demo-pill,.health,.live{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;border:1px solid #443760;border-radius:99px;padding:7px 11px;color:#c4b5fd;background:#8b5cf611}.demo-pill i,.health i,.live i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#a78bfa;margin-right:6px}.health{color:#86efac;border-color:#214d3d;background:#34d3990c}.health i,.live i{background:var(--green)}main{max-width:1200px;margin:auto;padding:76px 24px 40px}.hero{text-align:center}.eyebrow{font-size:11px;color:#a78bfa;font-weight:800;letter-spacing:.18em;margin:0 0 12px}.hero h1{font:800 clamp(38px,5vw,65px)/1.06 Syne;margin:0;letter-spacing:-.045em}.hero h1 span{background:linear-gradient(90deg,#a78bfa,#67e8f9);-webkit-background-clip:text;color:transparent}.hero-copy{color:var(--muted);font-size:17px;margin:22px auto 32px}.flow{display:flex;justify-content:center;align-items:center;gap:16px;margin:0 auto 64px}.flow div{text-align:left;background:#10131ccc;border:1px solid var(--line);padding:13px 18px;border-radius:12px;min-width:145px}.flow span{float:left;margin:3px 11px 0 0;color:#6d7280;font-size:10px}.flow b,.flow small{display:block}.flow b{font-size:13px}.flow small{color:var(--muted);font-size:10px;margin-top:2px}.flow em{font-style:normal;color:#555d72}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px}.metrics article,.panel,.integration-note{background:linear-gradient(145deg,#121620,#0d1018);border:1px solid var(--line);border-radius:16px}.metrics article{padding:22px;position:relative}.metrics p{font-size:13px;color:#b4bac8;margin:2px 0 12px}.metrics strong{display:block;font:700 31px Syne}.metrics small{color:#676e80;font-size:11px}.metric-icon{position:absolute;right:18px;top:18px;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-weight:bold}.violet{color:#a78bfa;background:#8b5cf619}.cyan{color:#67e8f9;background:#22d3ee19}.amber{color:#fde68a;background:#fbbf2419}.green{color:#6ee7b7;background:#34d39919}.workspace{display:grid;grid-template-columns:440px 1fr;gap:20px}.panel{padding:25px}.panel-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.panel-heading h2{font:700 21px Syne;margin:0}.live{font-size:9px;color:#6ee7b7;border-color:#1d493a}.muted{font-size:12px;color:var(--muted);margin:0 0 23px}form{display:grid;gap:15px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}label{font-size:11px;color:#b7bdca;font-weight:600}label span{color:#666e7d;font-weight:400}input{display:block;width:100%;margin-top:7px;border:1px solid #2b3141;background:#090c13;color:#fff;border-radius:9px;padding:12px 13px;outline:none;font:13px DM Sans;transition:.2s}input:focus{border-color:#8b5cf6;box-shadow:0 0 0 3px #8b5cf618}.quick-codes{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.quick-codes span{font-size:10px;color:#707789}.quick-codes button,.refresh{background:#181c28;border:1px solid #303647;color:#aab1c0;border-radius:6px;padding:5px 8px;font-size:9px;cursor:pointer}.quick-codes button:hover,.refresh:hover{border-color:#8b5cf6;color:#c4b5fd}.submit{border:0;color:#fff;border-radius:9px;padding:13px;background:linear-gradient(90deg,#7c3aed,#6d28d9);font-weight:700;cursor:pointer;box-shadow:0 9px 24px #6d28d933}.submit:disabled{opacity:.5}.result{margin-top:18px;border:1px solid #303647;border-radius:10px;padding:14px;font-size:13px;line-height:1.5}.result.success{border-color:#22624c;background:#34d3990b}.result.win{border-color:#7c6121;background:#fbbf240c}.result.error{border-color:#6d2a3b;background:#fb71850a}.result b{display:block;margin-bottom:3px}.refresh{font-size:18px;padding:3px 9px}.table-wrap{overflow:auto;margin-top:20px}table{width:100%;border-collapse:collapse;font-size:12px}th{text-align:left;color:#666f80;font-size:9px;text-transform:uppercase;letter-spacing:.08em;padding:10px;border-bottom:1px solid var(--line)}td{padding:13px 10px;border-bottom:1px solid #1d2230;color:#aeb5c4}td b,td small{display:block}td b{color:#e8eaf0;font-size:12px}td small{font-size:9px;color:#656c7b;margin-top:3px}td code,.integration-note code{color:#c4b5fd;background:#8b5cf611;border:1px solid #443760;border-radius:5px;padding:3px 6px}.badge{white-space:nowrap;border-radius:99px;padding:5px 8px;font-size:9px;font-weight:700}.winner{color:#fde68a;background:#fbbf2413}.registered{color:#6ee7b7;background:#34d39913}.empty td{text-align:center;padding:70px 20px;border:0;color:#6e7586}.empty span,.empty small{display:block}.empty span{font-size:28px;margin-bottom:10px}.empty small{margin-top:5px}.integration-note{margin-top:20px;padding:18px 22px;display:flex;align-items:center;gap:14px}.integration-note>span{font:bold 16px monospace;color:#a78bfa;background:#8b5cf619;padding:10px;border-radius:9px}.integration-note b,.integration-note code{display:block}.integration-note div code{margin-top:5px}.integration-note p{margin-left:auto;color:#7d8495;font-size:11px}footer{text-align:center;color:#555c6c;font-size:10px;padding:20px 20px 36px}@media(max-width:900px){.metrics{grid-template-columns:1fr 1fr}.workspace{grid-template-columns:1fr}.flow{overflow:auto;justify-content:flex-start}.hero{text-align:left}.integration-note{align-items:flex-start;flex-wrap:wrap}.integration-note p{margin:0}}@media(max-width:520px){main{padding:45px 15px}.topbar{padding:0 15px}.health{display:none}.metrics{grid-template-columns:1fr 1fr}.metrics article{padding:17px}.form-grid{grid-template-columns:1fr}.flow div{min-width:126px}.panel{padding:19px}}

