*{box-sizing:border-box}body{color:#eee;background:#111;margin:0;font-family:system-ui,sans-serif}.wrap{flex-direction:column;max-width:40rem;min-height:100dvh;margin:0 auto;padding:.75rem;display:flex}header{justify-content:space-between;align-items:baseline;display:flex}h1{margin:.25rem 0;font-size:1.2rem}.conn{font-size:.8rem}.conn.ok{color:#6c6}.conn.bad{color:#e83}.chips{flex-wrap:wrap;gap:.3rem;margin:.5rem 0;display:flex}.chip{background:#2a2a2a;border-radius:1rem;padding:.15rem .6rem;font-size:.8rem}.log{border:1px solid #333;border-radius:.5rem;flex:1;margin-bottom:.5rem;padding:.6rem;overflow-y:auto}.log p{margin:.25rem 0}.you{color:#8ac}.sys{color:#999;font-style:italic}.err{color:#e66;margin:.25rem 0}form{gap:.4rem;display:flex}input{color:#eee;background:#1c1c1c;border:1px solid #444;border-radius:.5rem;flex:1;padding:.6rem;font-size:1.1rem}button{color:#fff;background:#35c;border:none;border-radius:.5rem;padding:.6rem 1.2rem;font-size:1.1rem}button:disabled{opacity:.5}.debug{color:#aaa;margin-top:.5rem;font-size:.8rem}.debug pre{background:#1a1a1a;border-radius:.5rem;padding:.5rem;overflow-x:auto}.debug a{color:#8ac}
