/* Documents & company knowledge */
.kn-busy,.kn-done{display:none!important}
.agent-demo[data-state="tidying"] .kn-busy{display:inline-block!important}
.agent-demo[data-state="tidy"] .kn-done{display:inline-block!important}
.kn-files{list-style:none;margin:0;padding:6px 16px 4px}
.kn-file{display:grid;grid-template-columns:28px 1fr;gap:10px;align-items:start;padding:12px 0;border-bottom:1px solid #1c2c3d}
.kn-file:last-child{border-bottom:0}
.kn-icon{width:28px;height:28px;border-radius:7px;display:grid;place-items:center;background:#16263a;color:#7d93a8;font-size:.8rem}
.kn-names{display:grid;min-width:0}
.kn-old{font:500 .82rem/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#c8d6e3;transition:color .4s,font-size .4s}
.kn-new{max-height:0;overflow:hidden;opacity:0;font-size:.84rem;font-weight:600;color:#f5f7fb;line-height:1.4;transition:max-height .5s,opacity .5s}
.kn-folder{max-height:0;overflow:hidden;opacity:0;justify-self:start;margin-top:0;font-size:.68rem;font-weight:600;color:#88d8f5;background:#193e55;border-radius:20px;padding:0 9px;transition:max-height .5s,opacity .5s,margin .5s,padding .5s}
.kn-file.on .kn-old{color:#5f7489;font-size:.72rem;text-decoration:line-through}
.kn-file.on .kn-new{max-height:3em;opacity:1}
.kn-file.on .kn-folder{max-height:2em;opacity:1;margin-top:5px;padding:2px 9px}
.kn-file.on .kn-icon{background:#10283a;color:#6fd3f5}
.agent-demo .kn-rule{margin:4px 16px 16px;padding:10px 12px;border-radius:10px;background:#122334;font-size:.76rem;line-height:1.5;color:#c8d6e3}
.kn-rule b{color:#f5f7fb}
.kn-chat{height:300px}
/* Training & SOPs */
.tr-voice{display:grid;grid-template-columns:38px 1fr;gap:6px 12px;align-items:center;padding:14px 16px 6px}
.tr-avatar{flex:0 0 auto;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#1d3247;color:#cfe0ee;font-size:.78rem;font-weight:700}
.tr-voice strong,.up-contact strong{display:block;font-size:.86rem;color:#f5f7fb}
.tr-voice small,.up-contact small{display:block;font-size:.72rem;color:#9fb4c8}
.tr-bars{grid-column:1/-1;display:flex;align-items:center;gap:4px;height:28px;padding:4px 10px;border-radius:8px;background:#122334}
.tr-bars i{flex:1;height:5px;border-radius:2px;background:#35506a}
.agent-demo[data-state="recording"] .tr-bars i{background:#35b8e6;animation:tr-bar .6s ease-in-out infinite alternate}
.tr-bars i:nth-child(2n){animation-delay:-.25s}.tr-bars i:nth-child(3n){animation-delay:-.45s}
.tr-transcript{padding:6px 16px 14px}
.agent-demo .tr-transcript p{margin:0 0 8px;min-height:1px;font-size:.8rem;line-height:1.5;color:#c8d6e3;font-style:italic}
.tr-draft,.tr-approved{display:none!important}
.agent-demo[data-state="drafting"] .tr-draft{display:inline-block!important}
.agent-demo[data-state="approved"] .tr-approved{display:inline-block!important}
.tr-sop{padding:14px 16px 14px}
.tr-sop ol{margin:0;padding:0 0 0 20px;counter-reset:none}
.tr-sop li{margin:0 0 9px;padding-left:4px;font-size:.8rem;line-height:1.45;color:#e3edf6;opacity:0;transform:translateX(-6px);transition:opacity .45s,transform .45s}
.tr-sop li.on{opacity:1;transform:none}
.tr-sop li::marker{color:#6fd3f5;font-weight:700}
.tr-chat{height:300px}
.tr-insight{grid-column:1/-1;display:flex;align-items:center;gap:12px;padding:12px 16px;border-color:#6b5a38;background:#211d14}
.tr-flag{flex:0 0 auto;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;border:1px solid #af8f56;color:#e6c17c;font-weight:700;font-size:.8rem}
.agent-demo .tr-insight p{margin:0;font-size:.82rem;line-height:1.5;color:#e6d3ac}
.tr-insight b{color:#f1d9a6}
/* Customer updates */
.up-phone{display:flex;flex-direction:column}
.up-contact{display:flex;align-items:center;gap:12px;padding:14px 16px 6px}
.up-chat{height:340px}
.up-job{padding:8px 16px 12px}
.up-row{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px solid #1c2c3d;font-size:.78rem;opacity:.3;transition:opacity .4s}
.up-row:last-child{border-bottom:0}
.up-row.on{opacity:1}
.up-row span{color:#9fb4c8}
.up-row strong{font-weight:600;color:#e3edf6;text-align:right}
.up-eta strong{color:#e6c17c}
@keyframes tr-bar{from{height:5px}to{height:20px}}
.agent-demo.paused .tr-bars i{animation-play-state:paused}
@media(max-width:860px){.kn-chat,.tr-chat{height:280px}.up-chat{height:320px}}
@media(prefers-reduced-motion:reduce){.tr-bars i{animation:none!important}.tr-sop li,.kn-new,.kn-folder,.kn-old{transition:none}}