:root{--bg: #0f0f12;--surface: #1a1a1f;--border: #2a2a32;--text: #e8e6e3;--muted: #8b8685;--accent: #7c9cff;--ok: #6bcb77;--warn: #f4a261}*{box-sizing:border-box}body{margin:0;font-family:JetBrains Mono,Fira Code,ui-monospace,monospace;font-size:13px;background:var(--bg);color:var(--text);line-height:1.5}#app{max-width:1200px;margin:0 auto;padding:1.5rem}h1{font-size:1.25rem;font-weight:600;margin:0 0 .5rem;color:var(--accent)}.sub{color:var(--muted);font-size:.85rem;margin-bottom:1.5rem}.panels{display:grid;grid-template-columns:1fr 1fr;gap:1rem}@media(max-width:800px){.panels{grid-template-columns:1fr}}.panel{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:1rem}.panel h2{font-size:1rem;margin:0 0 .75rem;padding-bottom:.5rem;border-bottom:1px solid var(--border)}.panel.alice h2{color:#ff8a80}.panel.bob h2{color:#80deea}.section{margin-bottom:1rem}.section h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:0 0 .5rem}.collab-file{margin-bottom:.6rem}.collab-file label{display:block;font-size:.7rem;color:var(--muted);margin-bottom:.2rem}.collab-file textarea{min-height:90px}input,textarea,button{font:inherit;color:inherit;background:var(--bg);border:1px solid var(--border);border-radius:4px;padding:.4rem .6rem}input,textarea{width:100%;margin-bottom:.4rem}textarea{min-height:60px;resize:vertical}button{cursor:pointer;margin-right:.4rem;margin-bottom:.4rem}button:hover{background:var(--border)}button.primary{background:var(--accent);border-color:var(--accent);color:var(--bg)}.log{font-size:.75rem;max-height:120px;overflow-y:auto;background:var(--bg);border:1px solid var(--border);border-radius:4px;padding:.5rem;white-space:pre-wrap;word-break:break-all}#sql-result-alice,#sql-result-bob{max-height:200px;font-family:JetBrains Mono,Fira Code,ui-monospace,monospace;font-size:.7rem;line-height:1.4}.log .ok{color:var(--ok)}.log .warn{color:var(--warn)}.log .err{color:#ff6b6b}.hidden{display:none!important}.config{margin-bottom:1rem}.config label,.config input,.config select{margin-right:.5rem}.config .hint{color:var(--muted);font-size:.8rem;margin-right:.5rem}.config .hint code{font-size:.85em}#test-result,#test-libp2p-result{margin-left:.5rem;font-size:.9rem}#test-result.ok,#test-libp2p-result.ok{color:var(--ok)}#test-result.err,#test-libp2p-result.err{color:#ff6b6b}.status{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:.5rem;background:var(--muted)}.status.on{background:var(--ok)}.status.off{background:var(--warn)}
