
#ppl-ai-root,#ppl-ai-root *{box-sizing:border-box}
#ppl-ai-root{--ppl-black:#000;--ppl-white:#fff;--ppl-border:#e8e8e8;--ppl-soft:#f7f7f7}

.ppl-launcher{
 position:fixed;right:24px;bottom:24px;width:64px;height:64px;border:1px solid rgba(255,255,255,.22);
 border-radius:50%;background:#000;color:#fff;cursor:pointer;z-index:999998;
 box-shadow:0 12px 35px rgba(0,0,0,.30);display:flex;align-items:center;justify-content:center;
 font:28px Arial,sans-serif;transition:transform .2s ease,box-shadow .2s ease
}
.ppl-launcher:hover{transform:translateY(-2px);box-shadow:0 16px 42px rgba(0,0,0,.36)}
.ppl-launcher .ppl-badge{
 position:absolute;right:-2px;top:-4px;background:#fff;color:#000;border:2px solid #000;
 font:700 10px/20px Arial;width:23px;height:23px;border-radius:50%
}

.ppl-chat{
 position:fixed;right:24px;bottom:100px;width:430px;height:min(720px,calc(100vh - 125px));
 background:#fff;border:1px solid #e5e5e5;border-radius:20px;z-index:999999;overflow:hidden;
 display:none;flex-direction:column;box-shadow:0 24px 70px rgba(0,0,0,.25);
 font-family:Arial,Helvetica,sans-serif;color:#000
}
.ppl-chat.open{display:flex}

.ppl-header{
 background:#000;color:#fff;padding:19px 50px 18px;text-align:center;position:relative;border-bottom:1px solid #222
}
.ppl-header strong{display:block;font-size:17px;line-height:1.2;font-weight:700;letter-spacing:.1px;margin-bottom:6px}
.ppl-header span{display:block;font-size:12px;line-height:1.3;color:#d7d7d7;font-weight:500}
.ppl-back,.ppl-min{
 position:absolute;top:16px;border:0;background:transparent;color:#fff;font-size:25px;cursor:pointer;
 width:32px;height:32px;line-height:30px;border-radius:50%
}
.ppl-back:hover,.ppl-min:hover{background:#1d1d1d}
.ppl-back{left:12px}.ppl-min{right:12px}

.ppl-thread{flex:1;overflow:auto;padding:20px 18px 10px;background:#fff;scroll-behavior:smooth}
.ppl-row{display:flex;margin:0 0 13px;align-items:flex-end;gap:9px}
.ppl-row.user{justify-content:flex-end}
.ppl-bubble{
 max-width:84%;padding:13px 15px;border-radius:16px;background:#f5f5f5;color:#000;
 border:1px solid #ececec;font-size:14px;line-height:1.48;box-shadow:none;white-space:pre-wrap
}
.ppl-row.bot .ppl-bubble{border-bottom-left-radius:5px}
.ppl-row.user .ppl-bubble{background:#000;color:#fff;border-color:#000;border-bottom-right-radius:5px}
.ppl-avatar{
 width:32px;height:32px;border-radius:50%;background:#000;color:#fff;border:1px solid #000;
 display:flex;align-items:center;justify-content:center;flex:0 0 32px;font-size:15px
}
.ppl-meta{font-size:10px;color:#777;margin-top:-8px;margin-bottom:13px;padding-left:41px}

.ppl-quick{
 padding:7px 18px 12px;background:#fff;display:flex;gap:7px;overflow-x:auto;flex-wrap:nowrap;
 border-top:1px solid #f1f1f1;scrollbar-width:none
}
.ppl-quick::-webkit-scrollbar{display:none}
.ppl-chip{
 flex:0 0 auto;border:1px solid #000;background:#fff;border-radius:999px;padding:8px 12px;
 font:600 11px Arial;color:#000;cursor:pointer;transition:.18s ease
}
.ppl-chip:hover{background:#000;color:#fff}

.ppl-actions{padding:0 18px 13px;background:#fff;display:flex;gap:9px}
.ppl-book,.ppl-human{
 flex:1;text-align:center;text-decoration:none!important;border-radius:9px;padding:11px 10px;
 font:700 13px Arial;cursor:pointer;transition:.18s ease
}
.ppl-book{background:#000;border:1px solid #000;color:#fff!important}
.ppl-book:hover{background:#202020;color:#fff!important}
.ppl-human{background:#fff;border:1px solid #000;color:#000}
.ppl-human:hover{background:#f4f4f4}

.ppl-compose{
 display:flex;gap:8px;align-items:flex-end;padding:11px 12px 13px;background:#fff;border-top:1px solid #eaeaea
}
.ppl-compose textarea{
 flex:1;resize:none;height:46px;max-height:100px;border:1px solid #dedede;border-radius:12px;outline:0;
 padding:13px 12px;font:14px Arial;color:#000;background:#fff
}
.ppl-compose textarea:focus{border-color:#000}
.ppl-compose textarea::placeholder{color:#858585}
.ppl-send{
 width:46px;height:46px;flex:0 0 46px;border:0;border-radius:12px;background:#000;color:#fff;
 cursor:pointer;font-size:18px;transition:.18s ease
}
.ppl-send:hover{background:#202020}.ppl-send:disabled{opacity:.55;cursor:not-allowed}

.ppl-form{display:none;padding:15px 18px;background:#fff;border-top:1px solid #eaeaea}
.ppl-form.open{display:block}
.ppl-form h4{margin:0 0 5px;color:#000;font-size:15px}
.ppl-form p{font-size:12px;line-height:1.4;margin:0 0 10px;color:#666}
.ppl-form input,.ppl-form textarea{
 width:100%;border:1px solid #dedede;border-radius:9px;padding:10px 11px;margin-bottom:8px;
 font:13px Arial;background:#fff;color:#000;outline:0
}
.ppl-form input:focus,.ppl-form textarea:focus{border-color:#000}
.ppl-form textarea{height:72px;resize:vertical}
.ppl-submit{
 width:100%;border:1px solid #000;border-radius:9px;background:#000;color:#fff;padding:11px 15px;
 font-weight:700;cursor:pointer
}
.ppl-submit:hover{background:#202020}
.ppl-status{font-size:12px;line-height:1.4;margin-top:8px;color:#333}

.ppl-typing{display:inline-flex;gap:4px;align-items:center}
.ppl-typing i{display:block;width:6px;height:6px;border-radius:50%;background:#000;animation:ppldot 1.1s infinite ease-in-out}
.ppl-typing i:nth-child(2){animation-delay:.15s}.ppl-typing i:nth-child(3){animation-delay:.3s}
@keyframes ppldot{0%,80%,100%{transform:scale(.65);opacity:.3}40%{transform:scale(1);opacity:1}}

@media(max-width:600px){
 .ppl-chat{right:0;bottom:0;width:100%;height:100dvh;border-radius:0;border:0}
 .ppl-launcher{right:16px;bottom:18px;width:58px;height:58px}
 .ppl-header{padding-top:17px;padding-bottom:16px}
 .ppl-thread{padding-left:14px;padding-right:14px}
 .ppl-quick,.ppl-actions{padding-left:14px;padding-right:14px}
}
