:root{--bg: #08080b;--card: #0f0f14;--line: rgba(255, 255, 255, .05);--accent: #00e5ff;--accent2: #ffd700;--text: #e8e9f0;--muted: #7a7d8c}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif}.shell{display:flex;flex-direction:column;height:100vh}.topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;border-bottom:1px solid var(--line);background:#ffffff05}.title{font-weight:800;letter-spacing:1px;font-size:15px;color:var(--accent)}.demo-badge{background:#ffd7001f;border:1px solid var(--accent2);color:var(--accent2);font-size:12px;font-weight:700;letter-spacing:.5px;padding:4px 10px;border-radius:999px}.controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap}button,select,input{background:#16161d;color:var(--text);border:1px solid var(--line);border-radius:8px;padding:8px 12px;font-size:13px;cursor:pointer;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}button.active{background:var(--accent);color:#000;border-color:var(--accent);font-weight:700}button.pause.active{background:var(--accent2);color:#000}button.big{font-size:16px;font-weight:800;padding:14px 28px;margin-top:8px}button.mic{border-color:#0f86}button.mic.active{background:#0f8;color:#000;font-weight:700}select,input{cursor:text}input{width:220px}.microw{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.micbadge{font-size:12px;font-weight:800;letter-spacing:.5px;color:var(--muted);background:#101018;border:1px solid var(--line);border-radius:999px;padding:4px 12px}.micbadge.on{color:#0f8;border-color:#0f86}.grid{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:16px 20px;overflow:auto}.panel{display:flex;flex-direction:column;gap:12px}.panel h2{margin:0 0 4px;font-size:13px;text-transform:uppercase;letter-spacing:1px;color:var(--muted, #9aa0b4)}.panel.emisor h2{color:var(--accent)}.panel.interlocutor h2{color:var(--accent2)}.box{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 14px;min-height:84px;display:flex;flex-direction:column;gap:8px;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}.box label{font-size:11px;font-weight:800;letter-spacing:.5px;color:#6dd6ec;text-transform:uppercase}.box>div{font-size:15px;line-height:1.4;min-height:20px;white-space:pre-wrap;word-break:break-word;color:var(--text)}.box.intent{border-color:#a78bfa66}.box.intent label{color:#a78bfa}.box.vocal{border-color:#0f86}.box.vocal label{color:#0f8}.box input{width:100%;margin-top:4px}.statusbar{display:flex;align-items:center;gap:8px;padding:10px 20px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.dot{width:10px;height:10px;border-radius:50%;background:#0f8;box-shadow:0 0 8px #0f8}.dot.paused{background:var(--accent2);box-shadow:none}.dot.on{background:#0f8}.center{flex:1;display:flex;align-items:center;justify-content:center;padding:24px}.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:28px 32px;max-width:460px;text-align:center}.card h2{margin:0 0 10px;color:var(--accent)}.card p{color:var(--muted);margin:8px 0}.card .mono{font-family:JetBrains Mono,monospace;font-size:13px;color:var(--accent2);word-break:break-all}.sharebar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 20px;background:#ffffff05;border-bottom:1px solid var(--line);font-size:13px}.sharebar code{font-family:JetBrains Mono,monospace;background:#101018;padding:6px 10px;border-radius:8px;color:var(--accent2);word-break:break-all}.hint{font-size:12px;color:var(--muted)}