@import "https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&family=IBM+Plex+Mono:wght@400;500&display=swap";:root{--ink:#112126;--ink-soft:#3a5c63;--surface:#fff8ed;--line:#0a3d462e;--mono-font:"IBM Plex Mono", monospace}*{box-sizing:border-box}body{color:var(--ink);background:radial-gradient(circle at 8% 2%,#1c707e40,#0000 34%),radial-gradient(circle at 95% 86%,#ed73453d,#0000 36%),linear-gradient(170deg,#f6ead5,#ecf4f2 45%,#f8f4ec 100%);min-height:100vh;margin:0;font-family:Space Grotesk,sans-serif}input,textarea,button{font-family:inherit}.page{width:min(1180px,100% - 2rem);margin:2rem auto 3rem}.masthead{border:1px solid var(--line);color:var(--surface);background:linear-gradient(130deg,#043f47f2,#096777e0);border-radius:1.4rem;padding:2.4rem;animation:.38s ease-out both rise-in;box-shadow:0 20px 60px #04282c59}.kicker{text-transform:uppercase;letter-spacing:.16rem;color:#fffaedc7;margin:0 0 .6rem;font-size:.76rem}.masthead h1{margin:0;font-size:clamp(1.9rem,3vw,3rem);line-height:1.04}.subtitle{color:#fffaede6;max-width:62ch;margin:.95rem 0 0}.subtitle-note{color:#fffaedc7;margin-top:.55rem;font-size:.84rem}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1.3rem;display:grid}.panel{border:1px solid var(--line);background:var(--surface);border-radius:1.2rem;padding:1.15rem;animation:.42s ease-out both rise-in;box-shadow:0 15px 35px #1824271a}.panel-conversation{animation-delay:80ms}.panel-header{justify-content:space-between;align-items:flex-start;gap:.8rem;margin-bottom:1rem;display:flex}.panel h2{margin:0;font-size:1.08rem}.badge{font-family:var(--mono-font);color:#0d4f5a;white-space:nowrap;background:#0d4f5a14;border:1px solid #0d4f5a33;border-radius:999px;padding:.3rem .56rem;font-size:.68rem}.form{gap:.74rem;display:grid}.form label{color:var(--ink-soft);gap:.34rem;font-size:.86rem;display:grid}.form input,.form textarea{width:100%;color:var(--ink);font:inherit;background:#fff;border:1px solid #0e323a2b;border-radius:.74rem;padding:.66rem .72rem}.form input:focus,.form textarea:focus{border-color:#f1775473;outline:2px solid #f1775459}.checkbox-row{align-items:center;gap:.55rem;font-size:.86rem;display:flex}.checkbox-row input{width:auto}.form button{color:#fff8ed;letter-spacing:.02em;cursor:pointer;background:linear-gradient(145deg,#f17754,#da5630);border:none;border-radius:.82rem;margin-top:.35rem;padding:.7rem .92rem;font-weight:700;transition:transform .12s,filter .12s}.form button:hover:not(:disabled){filter:brightness(1.05);transform:translateY(-1px)}.form button:disabled{opacity:.66;cursor:progress}.error{color:#8e2818;background:#f7e1ddcc;border:1px solid #a1221633;border-radius:.74rem;margin:.8rem 0 0;padding:.62rem .7rem;font-size:.84rem}.status-checking{color:#666;margin:0 0 .8rem;font-size:.85rem}.status-connected,.status-disconnected{border-radius:.6rem;align-items:center;gap:.45rem;margin:0 0 .9rem;padding:.5rem .75rem;font-size:.88rem;font-weight:600;display:flex}.status-connected{color:#1a7a3f;background:#d1f1ddbf;border:1px solid #1a7a3f33}.status-disconnected{color:#8e2818;background:#f7e1ddbf;border:1px solid #a1221633}.status-dot{border-radius:50%;flex-shrink:0;width:.6rem;height:.6rem}.status-dot.connected{background:#1a7a3f}.status-dot.disconnected{background:#c0392b}.status-instance{opacity:.75;font-size:.8rem;font-weight:400}.already-connected{color:#1a7a3f;font-size:.85rem;font-style:italic}.result-box{background:#f3f9f9bf;border:1px solid #0f505a29;border-radius:.88rem;margin-top:.9rem;padding:.74rem}.result-box p{margin:0 0 .52rem;font-size:.88rem}.qr-image{background:#fff;border:1px solid #0000001f;border-radius:.6rem;width:min(310px,100%);margin-top:.55rem}details{margin-top:.8rem}summary{cursor:pointer;color:var(--ink);font-weight:600}pre{color:#d8f5f0;max-height:280px;font-family:var(--mono-font);background:#0e2d33;border-radius:.6rem;margin:.6rem 0 0;padding:.65rem;font-size:.74rem;line-height:1.46;overflow:auto}@keyframes rise-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (width<=960px){.grid{grid-template-columns:1fr}.panel-conversation{animation-delay:0s}.panel-header{flex-direction:column;gap:.5rem}.badge{white-space:normal}}
