:root{color-scheme:dark;--bg:#090b13;--panel:#141826d9;--border:#ffffff12;--text:#f7f8fc;--muted:#9299ad;--purple:#8b5cf6;--cyan:#22d3ee;--green:#34d399}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font:15px "DM Sans",Arial,sans-serif}.glow{position:fixed;width:460px;height:460px;border-radius:50%;filter:blur(120px);opacity:.16;pointer-events:none}.glow-a{top:-240px;left:-120px;background:#7c3aed}.glow-b{right:-160px;bottom:-250px;background:#0891b2}.shell{width:min(1120px,calc(100% - 40px));margin:auto;padding:28px 0 20px;position:relative}header,.brand,.hero,.panel-head,footer{display:flex;align-items:center}header{justify-content:space-between}.brand{gap:11px;color:var(--text);text-decoration:none}.brand>b{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--purple),var(--cyan));font-size:13px;box-shadow:0 8px 28px #7c3aed44}.brand strong,.brand small{display:block}.brand strong{font-size:16px}.brand small{color:var(--muted);font-size:11px;margin-top:2px}.secure{color:var(--muted);font-size:12px}.secure:first-letter{color:var(--green)}.hero{justify-content:space-between;gap:30px;padding:80px 0 34px}.hero label{color:var(--cyan);font-size:11px;font-weight:bold;letter-spacing:.18em}.hero h1{max-width:680px;margin:12px 0 0;font:700 clamp(32px,5vw,56px)/1.02 "Space Grotesk",Arial;letter-spacing:-.04em}.hero p{color:var(--muted);font-size:16px;margin:18px 0 0;max-width:580px}.hero i{padding:9px 13px;border:1px solid #ef444455;border-radius:99px;color:#fca5a5;font-size:11px;font-style:normal;font-weight:bold;letter-spacing:.1em}.panel{overflow:hidden;border:1px solid var(--border);border-radius:20px;background:var(--panel);box-shadow:0 24px 80px #00000040;backdrop-filter:blur(18px)}.panel-head{justify-content:space-between;min-height:58px;padding:0 20px;border-bottom:1px solid var(--border);color:#d8dce8;font-size:13px}.panel-head>span{display:flex;align-items:center;gap:9px}.panel-head em{width:8px;height:8px;border-radius:50%;background:#64748b;font-style:normal}.panel-head em.loading{background:#fbbf24;box-shadow:0 0 12px #fbbf24}.panel-head em.live{background:var(--green);box-shadow:0 0 12px var(--green)}.panel-head em.connected{background:var(--cyan)}.panel-head em.error{background:#fb7185}.panel-head code{padding:5px 10px;border:1px solid var(--border);border-radius:7px;color:var(--muted);font-size:11px}.publisher{padding:22px 24px 4px}.publisher label{display:block;font-weight:600;margin-bottom:9px}.input-row{display:flex;gap:10px}input{min-width:0;flex:1;padding:12px 14px;border:1px solid #ffffff18;border-radius:10px;outline:0;background:#090b1399;color:var(--text);font:inherit}input:focus{border-color:var(--purple);box-shadow:0 0 0 3px #8b5cf622}button{border:0;border-radius:10px;padding:0 16px;color:#fff;cursor:pointer;font:600 13px inherit;transition:.2s}button:hover{filter:brightness(1.14);transform:translateY(-1px)}.primary{background:linear-gradient(135deg,#7c3aed,#2563eb)}.danger{background:#be123c}.publisher>small{display:block;color:var(--muted);font-size:12px;margin:9px 0 16px}.stage{display:grid;place-items:center;min-height:460px;margin:20px;border:1px solid var(--border);border-radius:14px;background:radial-gradient(circle at 50% 20%,#20253a,#0d101b 58%)}#emptyState{display:grid;justify-items:center;gap:10px;padding:40px 20px;text-align:center}#emptyState[hidden]{display:none}.screen-icon{display:grid;place-items:center;width:58px;height:58px;margin-bottom:8px;border:1px solid #8b5cf655;border-radius:16px;color:var(--cyan);font-size:25px;background:#8b5cf611}#emptyState strong{font-size:18px}#emptyState span{color:var(--muted);font-size:13px}.stage video{display:block;width:100%;max-height:70vh;border-radius:13px;background:#000}footer{justify-content:space-between;padding:18px 2px 0;color:#5e667a;font-size:11px}[hidden]{display:none!important}@media(max-width:680px){.shell{width:calc(100% - 24px);padding-top:18px}.hero{display:block;padding-top:55px}.hero i{display:inline-block;margin-top:25px}.input-row{display:grid;grid-template-columns:1fr}button{min-height:44px}.stage{min-height:300px;margin:14px}.secure{display:none}}