:root{color:#111b21;--green:#008069;--bubble-user:#d9fdd3;background:#f0f2f5;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{margin:0}.layout{flex-wrap:wrap;justify-content:center;gap:1.5rem;padding:1.5rem;display:flex}.phone{background:#efeae2;border-radius:1.25rem;flex-direction:column;width:min(420px,100%);height:min(760px,100vh - 3rem);display:flex;overflow:hidden;box-shadow:0 8px 24px #00000026}.chat-header{color:#fff;background:var(--green);align-items:center;gap:.75rem;padding:.75rem 1rem;display:flex}.chat-header h1{margin:0;font-size:1rem}.chat-header p{opacity:.85;margin:0;font-size:.75rem}.avatar{width:2.25rem;height:2.25rem;color:var(--green);background:#fff;border-radius:50%;place-items:center;font-size:.8rem;font-weight:700;display:grid}.chat{flex:1;margin:0;padding:1rem;list-style:none;overflow-y:auto}.bubble{border-radius:.5rem;max-width:85%;margin-bottom:.5rem;padding:.5rem .75rem;box-shadow:0 1px 1px #0000001a}.bubble p{white-space:pre-wrap;margin:0}.bubble.bot{background:#fff}.bubble.user{background:var(--bubble-user);margin-left:auto}.reply-buttons{border-top:1px solid #e9edef;gap:1px;margin:.5rem -.75rem -.5rem;display:grid}.reply-buttons button{font:inherit;color:#027eb5;cursor:pointer;background:#fff;border:0;border-top:1px solid #e9edef;padding:.6rem}.reply-buttons button:first-child{border-top:0}.reply-buttons button:hover,.reply-buttons button:focus-visible{background:#f5f6f6}.composer{background:#f0f2f5;gap:.5rem;padding:.75rem;display:flex}.composer input{font:inherit;border:0;border-radius:1.25rem;flex:1;padding:.6rem .9rem}.composer button,.panel button{font:inherit;color:#fff;background:var(--green);cursor:pointer;border:0;border-radius:1.25rem;padding:.6rem 1rem}.panel{background:#fff;border-radius:1rem;width:min(360px,100%);padding:1rem 1.25rem;box-shadow:0 8px 24px #00000014}.panel h2{margin:1rem 0 .5rem;font-size:1rem}.panel h2:first-child{margin-top:0}.toggle{align-items:center;gap:.5rem;margin-bottom:.75rem;display:flex}.issues{margin:0;padding-left:1.1rem}.issues .issue{color:#b42318}.issues .ok{color:var(--green)}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}
