:root{--bg:#0e1020;--p1:#14172b;--p2:#1a1e37;--ln:rgba(255,255,255,.07);--tx:#e9e8fb;--mu:#8e8db3;--v:#7c5cff;--e:#f7931e;--w:#25d366;--t:#2aabee;--ok:#22c55e;--warn:#f59e0b}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:"PK Baloo Bhaijaan 2",system-ui,sans-serif;background:var(--bg);color:var(--tx);font-size:14px;line-height:1.6;overflow:hidden}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:12px;padding:9px 16px;background:linear-gradient(135deg,var(--v),#5b3df5);color:#fff;font-weight:800;cursor:pointer;white-space:nowrap;transition:.2s}
.btn:hover{filter:brightness(1.12)}
.btn.wide{width:100%;padding:13px}
.app{display:grid;grid-template-columns:250px 340px 1fr;grid-template-rows:64px 1fr;height:100vh;height:100dvh}
.top{grid-column:1/-1;display:flex;align-items:center;gap:18px;padding:0 18px;border-bottom:1px solid var(--ln);background:var(--p1)}
.logo{display:flex;align-items:center;gap:8px;flex:none}
.logo i{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;font-style:normal;background:conic-gradient(from 200deg,var(--e),var(--w),var(--t),var(--v),var(--e));color:#fff}
.logo b{font-size:1.1rem}.logo small{color:var(--mu);font-size:.8rem;padding-inline-start:8px;border-inline-start:1px solid var(--ln)}
.kp{display:flex;gap:22px;margin-inline-start:auto}
.kp div{display:flex;flex-direction:column;line-height:1.25}
.kp small{color:var(--mu);font-size:.72rem}.kp b{font-size:1.02rem;transition:color .4s}
.kp b.up{color:var(--ok)}
.pilot{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:.85rem;color:var(--mu)}
.pilot input{display:none}
.pilot span{width:40px;height:22px;border-radius:99px;background:#333654;position:relative;transition:.25s}
.pilot span i{position:absolute;top:3px;inset-inline-start:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:.25s}
.pilot input:checked+span{background:var(--ok)}
.pilot input:checked+span i{inset-inline-start:21px}
.pilot em{font-style:normal}
/* side */
.side{background:var(--p1);border-inline-end:1px solid var(--ln);padding:14px;overflow:auto}
.side h4{font-size:.74rem;color:var(--mu);font-weight:400;margin:14px 4px 7px;letter-spacing:.02em}
.side h4:first-child{margin-top:2px}
.fl{display:grid;gap:3px}
.fl button{display:flex;align-items:center;gap:9px;border:0;background:none;border-radius:10px;padding:7px 9px;cursor:pointer;text-align:start;color:#cfcdf0}
.fl button:hover{background:rgba(255,255,255,.04)}
.fl button.on{background:rgba(124,92,255,.16);color:#fff}
.fl button em{margin-inline-start:auto;font-style:normal;font-size:.75rem;color:var(--mu);background:rgba(255,255,255,.05);border-radius:99px;padding:0 8px}
.dot{width:10px;height:10px;border-radius:50%;flex:none}
.d-w{background:var(--w)}.d-e{background:var(--e)}.d-t{background:var(--t)}.d-a{background:conic-gradient(var(--w),var(--e),var(--t),var(--w))}
.mf{display:grid;gap:6px;padding:2px 4px}
.mf .r{display:grid;grid-template-columns:72px 1fr 44px;gap:7px;align-items:center;font-size:.76rem;color:#c9c7ea}
.mf .bar{height:8px;border-radius:9px;background:rgba(255,255,255,.05);overflow:hidden;direction:ltr}
.mf .bar i{display:block;height:100%;border-radius:9px;transition:width .8s}
.mf b{text-align:end;font-weight:400;font-size:.74rem}
.cps{display:grid;gap:7px}
.cp{background:var(--p2);border:1px solid var(--ln);border-radius:12px;padding:9px 11px}
.cp .h{display:flex;justify-content:space-between;gap:6px;align-items:center}
.cp b{font-size:.84rem}.cp small{color:var(--mu);font-size:.72rem}
.cp .st{font-size:.68rem;padding:0 7px;border-radius:99px;background:rgba(34,197,94,.15);color:#6ee7a0}
.cp .st.done{background:rgba(255,255,255,.06);color:var(--mu)}
.cp .pg{height:5px;border-radius:9px;background:rgba(255,255,255,.06);margin-top:7px;overflow:hidden;direction:ltr}
.cp .pg i{display:block;height:100%;background:linear-gradient(90deg,var(--v),var(--t));transition:width .6s}
.cp.nw{animation:fl 1.2s}
@keyframes fl{0%{box-shadow:0 0 0 2px var(--v)}100%{box-shadow:0 0 0 0 transparent}}
/* list */
.list{display:flex;flex-direction:column;border-inline-end:1px solid var(--ln);min-height:0;background:var(--bg)}
.lh{display:flex;align-items:center;gap:10px;padding:12px}
.lh input{flex:1;min-width:0;background:var(--p2);border:1px solid var(--ln);border-radius:12px;padding:8px 12px;outline:0}
.lh input:focus{border-color:var(--v)}
.live{display:flex;align-items:center;gap:6px;font-size:.75rem;color:#6ee7a0}
.live i{width:7px;height:7px;border-radius:50%;background:var(--ok);animation:bl 1.4s infinite}
@keyframes bl{50%{opacity:.25}}
.items{flex:1;overflow:auto;padding:0 8px 90px}
.it{display:flex;gap:10px;padding:10px;border-radius:14px;cursor:pointer;position:relative;transition:background .2s}
.it:hover{background:rgba(255,255,255,.03)}
.it.on{background:rgba(124,92,255,.14)}
.it.nw{animation:slide .5s cubic-bezier(.2,1.2,.4,1)}
@keyframes slide{from{opacity:0;transform:translateY(-12px)}}
.av{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-weight:800;color:#fff;flex:none;position:relative;font-size:1rem}
.av s{position:absolute;bottom:-2px;inset-inline-end:-2px;width:17px;height:17px;border-radius:50%;border:2px solid var(--bg);display:grid;place-items:center;font-size:.55rem;text-decoration:none;font-family:system-ui;font-weight:800}
.ib{flex:1;min-width:0}
.ib .a{display:flex;justify-content:space-between;gap:8px}
.ib b{font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ib time{font-size:.7rem;color:var(--mu);flex:none}
.ib p{color:var(--mu);font-size:.8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ib .c{display:flex;gap:6px;align-items:center;margin-top:3px}
.pill{font-size:.66rem;border-radius:99px;padding:0 8px;line-height:1.7}
.s-rep{background:rgba(42,171,238,.15);color:#7dd3fc}.s-neg{background:rgba(247,147,30,.16);color:#fdba74}.s-paid{background:rgba(34,197,94,.16);color:#86efac}.s-hum{background:rgba(224,68,124,.18);color:#f9a8d4}.s-lost{background:rgba(255,255,255,.06);color:var(--mu)}
.ub{margin-inline-start:auto;min-width:18px;height:18px;border-radius:99px;background:var(--ok);color:#04220f;font-size:.66rem;font-weight:800;display:grid;place-items:center;padding:0 5px}
.ty{color:#6ee7a0!important}
/* thread */
.thread{display:flex;flex-direction:column;min-height:0;background:radial-gradient(800px 400px at 50% 0,rgba(124,92,255,.08),transparent),var(--bg);position:relative}
.empty{margin:auto;text-align:center;color:var(--mu)}.empty b{font-size:3rem;display:block}
.th{display:flex;align-items:center;gap:11px;padding:10px 16px;border-bottom:1px solid var(--ln);background:var(--p1)}
.th[hidden]{display:none}
.back{display:none;border:0;background:none;font-size:1.3rem;cursor:pointer;width:34px}
html[dir=ltr] .back{transform:scaleX(-1)}
.tn{flex:1;min-width:0}.tn b{display:block}.tn small{color:var(--mu);font-size:.76rem}
.tv{text-align:end;line-height:1.25}.tv small{color:var(--mu);font-size:.7rem;display:block}.tv b{color:#fde68a;font-size:.9rem}
.take{border:1px solid rgba(224,68,124,.5);background:rgba(224,68,124,.12);color:#f9a8d4;border-radius:10px;padding:7px 12px;cursor:pointer;font-weight:800;white-space:nowrap}
.take.me{border-color:rgba(34,197,94,.5);background:rgba(34,197,94,.12);color:#86efac}
.msgs{flex:1;overflow:auto;padding:18px 7% 20px;display:flex;flex-direction:column;gap:8px}
.mm{max-width:72%;padding:8px 12px;border-radius:16px;animation:pop .3s cubic-bezier(.2,1.3,.4,1) both;word-wrap:break-word}
@keyframes pop{from{opacity:0;transform:translateY(8px) scale(.95)}}
.mm.in{align-self:flex-start;background:var(--p2);border-start-start-radius:5px}
.mm.out{align-self:flex-end;background:#3b2d8f;border-start-end-radius:5px}
.mm.me{background:#0f6b4f}
.mm small{display:block;text-align:end;font-size:.66rem;color:rgba(255,255,255,.55)}
.mm .who{font-size:.68rem;color:#c4b5fd;display:block}
.mm.me .who{color:#86efac}
.mm.card{padding:0;overflow:hidden;width:260px}
.mm.card .pi{height:90px;display:grid;place-items:center;font-size:2.6rem;background:linear-gradient(135deg,#3b2f7a,#7c5cff)}
.mm.card div{padding:8px 12px}.mm.card b{display:block}.mm.card span{color:#fde68a}
.mm.pay{background:linear-gradient(135deg,#15803d,#22c55e);font-weight:800}
.mm.sys{align-self:center;background:rgba(255,255,255,.05);color:var(--mu);font-size:.74rem;border-radius:99px;padding:3px 14px}
.mm.sys.ok{background:rgba(34,197,94,.14);color:#86efac;font-weight:800}
.mm.typing{display:flex;gap:4px;padding:12px 14px}
.mm.typing i{width:6px;height:6px;border-radius:50%;background:#b8b3e8;animation:tp 1s infinite}.mm.typing i:nth-child(2){animation-delay:.15s}.mm.typing i:nth-child(3){animation-delay:.3s}
@keyframes tp{50%{transform:translateY(-4px);opacity:.4}}
.comp{padding:10px 14px 14px;border-top:1px solid var(--ln);background:var(--p1)}
.comp[hidden],.botbar[hidden]{display:none}
.comp .row{display:flex;gap:8px}
.comp input{flex:1;min-width:0;background:var(--p2);border:1px solid var(--ln);border-radius:12px;padding:10px 12px;outline:0}
.sug{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.sug button{border:1px solid rgba(124,92,255,.4);background:rgba(124,92,255,.1);border-radius:99px;padding:3px 11px;font-size:.78rem;cursor:pointer;color:#d8ceff}
.botbar{display:flex;align-items:center;gap:9px;padding:12px 16px;border-top:1px solid var(--ln);background:var(--p1);color:var(--mu);font-size:.82rem;margin-bottom:0}
.botbar i{width:8px;height:8px;border-radius:50%;background:var(--v);animation:bl 1.2s infinite;flex:none}
/* drawer */
.drw{position:fixed;inset:0;z-index:80;background:rgba(5,6,14,.6);backdrop-filter:blur(4px);display:flex;justify-content:flex-start}
.drw[hidden]{display:none}
.dc{width:min(420px,100%);height:100%;overflow:auto;background:var(--p1);padding:20px;display:grid;gap:12px;align-content:start;animation:sl .35s cubic-bezier(.2,.9,.3,1);border-inline-end:1px solid var(--ln)}
@keyframes sl{from{transform:translateX(40px);opacity:0}}
.dh{display:flex;justify-content:space-between;align-items:center;font-size:1.1rem}
.x{border:0;background:rgba(255,255,255,.06);width:34px;height:34px;border-radius:10px;cursor:pointer}
.dc label{display:grid;gap:5px;font-size:.84rem;color:#c9c7ea}
.dc input:not([type]),.dc input[type=text],.dc select,.dc textarea,#cName{background:var(--p2);border:1px solid var(--ln);border-radius:12px;padding:9px 12px;outline:0;resize:vertical;width:100%}
.dc select option{background:var(--p2)}
.lbl{font-size:.84rem;color:#c9c7ea}
.chk{display:flex;gap:8px}
.chk label{display:flex!important;align-items:center;gap:6px;border:1px solid var(--ln);border-radius:12px;padding:7px 11px;cursor:pointer;flex:1}
.chk label:has(input:checked).w{border-color:var(--w);background:rgba(37,211,102,.1)}
.chk label:has(input:checked).e{border-color:var(--e);background:rgba(247,147,30,.1)}
.chk label:has(input:checked).t{border-color:var(--t);background:rgba(42,171,238,.1)}
.vars{display:flex;gap:6px;margin-top:-4px}
.vars button{border:1px dashed rgba(124,92,255,.5);background:none;border-radius:8px;padding:2px 9px;font-size:.76rem;cursor:pointer;color:#c4b5fd}
.pv small{color:var(--mu);font-size:.74rem}
.bub{background:#0b141a;border-radius:14px;padding:12px;margin-top:5px}
.bub div{background:#005c4b;border-radius:12px;border-start-end-radius:4px;padding:8px 11px;max-width:90%;margin-inline-start:auto;white-space:pre-wrap;font-size:.86rem}
input[type=range]{accent-color:var(--v)}
.note{font-size:.76rem;color:var(--mu)}
/* toasts */
.toasts{position:fixed;top:76px;inset-inline-start:50%;transform:translateX(-50%);z-index:95;display:grid;gap:8px;pointer-events:none;width:max-content;max-width:92vw}
html[dir=rtl] .toasts{transform:translateX(50%)}
.toast{background:#fff;color:#14152a;border-radius:14px;padding:9px 16px;font-weight:800;box-shadow:0 20px 40px -14px #000;animation:tin .4s cubic-bezier(.2,1.3,.4,1),tout .4s 3.4s forwards;display:flex;gap:8px;align-items:center}
.toast b{color:#16a34a}
@keyframes tin{from{opacity:0;transform:translateY(-14px)}}@keyframes tout{to{opacity:0;transform:translateY(-10px)}}
/* pkbar + credit */
.pkbar{position:fixed;bottom:14px;left:50%;transform:translateX(-50%);z-index:90;display:flex;gap:6px;padding:6px;border-radius:999px;background:rgba(20,23,43,.95);backdrop-filter:blur(12px);color:#fff;font-size:.82rem;box-shadow:0 20px 40px -10px #000;border:1px solid var(--ln)}
.pkbar a{padding:7px 13px;border-radius:999px;white-space:nowrap}
.pkbar a:hover{background:rgba(255,255,255,.1)}
.pkbar a.on{background:var(--v);font-weight:800}
.pkbar a.kl{background:#fbbf24;color:#1a1200;font-weight:800}
.dcred{position:fixed;bottom:4px;inset-inline-end:10px;z-index:5;font-size:.68rem;color:var(--mu);opacity:.8}
.dcred a{color:#c4b5fd}
.embed .pkbar,.embed .pk-lang{display:none}
@media (max-width:1180px){.app{grid-template-columns:210px 300px 1fr}.hide-s{display:none!important}.kp{gap:14px}}
@media (max-width:900px){
  .app{grid-template-columns:1fr;grid-template-rows:auto auto 1fr}
  .top{flex-wrap:wrap;gap:8px 12px;padding:10px 12px}
  .kp{order:3;width:100%;margin:0;justify-content:space-between}
  .logo small{display:none}
  .pilot em{display:none}
  .side{grid-row:2;border:0;border-bottom:1px solid var(--ln);padding:8px 10px;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}
  .side::-webkit-scrollbar{display:none}
  .side h4,.mf,.cps{display:none}
  .fl{display:flex;gap:5px}
  .fl button{white-space:nowrap;background:var(--p2);padding:5px 10px;border-radius:99px}
  .list{grid-row:3;border:0}
  .thread{position:fixed;inset:0;z-index:60;transform:translateX(-100%);transition:transform .35s cubic-bezier(.2,.9,.3,1);visibility:hidden}
  html[dir=ltr] .thread{transform:translateX(100%)}
  .app.open .thread{transform:none;visibility:visible}
  .back{display:block}
  .msgs{padding:14px 12px 20px}
  .mm{max-width:84%}
  .tv{display:none}
  .comp,.botbar{padding-bottom:70px}
  .dcred{display:none}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* QA R1: keep composer / bot bar above the floating pkbar; credit bottom-left */
@media (min-width:901px){.comp,.botbar{padding-bottom:78px}.dcred{inset-inline-end:auto;inset-inline-start:14px;bottom:6px;max-width:230px;line-height:1.4}}
/* QA R2 */
.mm.typing{width:fit-content;align-items:center;min-height:34px}
.side{padding-bottom:64px}
.dcred{background:var(--p1);padding:3px 8px;border-radius:8px}
.msgs>*{flex:none}
/* QA R3: credit lives at the end of the sidebar */

.side .dcred{position:static;display:block;margin-top:16px;padding:10px 4px 0;border-top:1px solid var(--ln);background:none;max-width:none;font-size:.7rem;line-height:1.6}
@media (max-width:900px){.side .dcred{display:flex!important;align-items:center;white-space:nowrap;margin:0;padding:0 10px;border:0;border-inline-start:1px solid var(--ln);flex:none}}
