/* Call Center card: a live voice-agent console, then the real post-call recap from the Coceyo CRM. */
.app-call{background:#0f1720}
.app-call .application-visual{inset:222px 0 78px}
.cc-film{position:absolute;inset:0 34px}
.cc-console{position:absolute;inset:0;border-radius:20px;overflow:hidden;background:linear-gradient(165deg,#15282c 0%,#0e151d 58%,#121022 100%);box-shadow:0 0 0 1px #ffffff14,0 30px 56px -24px #000c,inset 0 1px 0 #ffffff1f;color:#e9f4f5;font-family:Inter,system-ui,sans-serif;transform:translateZ(0)}
.cc-aura{position:absolute;left:-8%;top:8%;width:62%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(125,220,190,.2),rgba(130,100,255,.1) 45%,transparent 68%);filter:blur(10px);transition:background .9s,opacity .9s;pointer-events:none}
.cc-console[data-s=speaking] .cc-aura{background:radial-gradient(circle,rgba(180,150,255,.3),rgba(255,190,120,.12) 45%,transparent 68%)}
.cc-console[data-s=thinking] .cc-aura{background:radial-gradient(circle,rgba(255,206,140,.22),rgba(150,120,255,.12) 45%,transparent 68%)}
.cc-scene{position:absolute;inset:0;display:flex;flex-direction:column;padding:16px 18px 14px;opacity:0;transform:scale(.985);transition:opacity .7s ease,transform .9s cubic-bezier(.16,1,.3,1);pointer-events:none}
.cc-scene.on{opacity:1;transform:none}
.cc-top{display:flex;align-items:center;gap:12px;flex:none}
.cc-caller{display:flex;align-items:center;gap:8px;min-width:0}
.cc-caller>i{flex:none;width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#ffd9e4,#ffb8cf);color:#4b1330;display:grid;place-items:center;font:700 10px/1 Inter,system-ui,sans-serif;font-style:normal;box-shadow:0 0 0 2px #ffffff22}
.cc-caller b{display:block;font-size:12px;font-weight:600;letter-spacing:-.01em;white-space:nowrap}
.cc-caller span{display:block;margin-top:3px;font-size:9px;color:#8eaab0;white-space:nowrap}
.cc-clock{margin-left:auto;display:flex;align-items:center;gap:7px;font-size:9.5px;color:#9fc0c4;white-space:nowrap}
.cc-clock>i{width:6px;height:6px;border-radius:50%;background:#59e0a8;box-shadow:0 0 0 0 #59e0a888;animation:cc-live 1.8s infinite}
.cc-clock b{font-weight:500;color:#cfe6e8;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.cc-ended>i{background:#a99bff;animation:none}
@keyframes cc-live{70%{box-shadow:0 0 0 6px #59e0a800}100%{box-shadow:0 0 0 0 #59e0a800}}
.cc-badge{flex:none;display:flex;align-items:center;gap:7px;height:30px;padding:0 12px 0 4px;border-radius:99px;background:#ffffff12;box-shadow:inset 0 0 0 1px #ffffff1c;font-size:10px;font-weight:600;color:#dfeef0;transition:background .5s,color .5s}
.cc-badge img{width:22px;height:22px;border-radius:50%;background:#fff;object-fit:cover;object-position:50% 12%}
.cc-badge[data-s=listening]{background:#59e0a822;color:#a8f0cf;box-shadow:inset 0 0 0 1px #59e0a844}
.cc-badge[data-s=thinking]{background:#ffc97a1f;color:#ffdca3;box-shadow:inset 0 0 0 1px #ffc97a44}
.cc-badge[data-s=speaking]{background:#a99bff26;color:#d3caff;box-shadow:inset 0 0 0 1px #a99bff55}
.cc-badge[data-s=done]{background:#a99bff26;color:#d3caff;box-shadow:inset 0 0 0 1px #a99bff55}
.cc-body{flex:1;min-height:0;display:grid;grid-template-columns:232px 1fr;gap:6px;align-items:center;margin-top:4px}
.cc-orbcol{position:relative;height:100%;display:grid;place-items:center}
.cc-orb{position:absolute;left:50%;top:50%;width:340px;height:340px;margin:-170px 0 0 -170px;z-index:1;pointer-events:none}
.cc-orb canvas{display:block}
.cc-orbring{position:absolute;width:206px;height:206px;border-radius:50%;border:1px solid #ffffff14;box-shadow:0 0 0 14px #ffffff05,0 0 0 30px #ffffff03;transition:border-color .6s,transform .6s}
.cc-console[data-s=listening] .cc-orbring{border-color:#59e0a844;animation:cc-ring 2.2s ease-in-out infinite}
.cc-console[data-s=speaking] .cc-orbring{border-color:#a99bff55;animation:cc-ring 1.4s ease-in-out infinite}
.cc-console[data-s=thinking] .cc-orbring{border-color:#ffc97a44;animation:cc-ring 2.8s ease-in-out infinite}
@keyframes cc-ring{50%{transform:scale(1.045)}}
.cc-talk{display:flex;flex-direction:column;gap:7px;min-width:0;padding-right:2px}
.cc-msg{display:flex;align-items:flex-start;gap:7px;opacity:0;transform:translateY(8px);transition:opacity .45s ease,transform .6s cubic-bezier(.16,1,.3,1)}
.cc-msg.on{opacity:1;transform:none}
.cc-msg>i,.cc-msg>img{flex:none;width:22px;height:22px;border-radius:50%;margin-top:1px}
.cc-msg>i{background:linear-gradient(135deg,#ffd9e4,#ffb8cf);color:#4b1330;display:grid;place-items:center;font:700 7.5px/1 Inter,system-ui,sans-serif;font-style:normal}
.cc-msg>img{background:#fff;object-fit:cover;object-position:50% 12%}
.cc-msg p{margin:0;font-size:11px;line-height:1.42;letter-spacing:-.005em;padding:7px 11px;border-radius:4px 14px 14px 14px;background:#ffffff10;color:#dfeaec;box-shadow:inset 0 0 0 1px #ffffff12;min-height:1.42em;max-width:100%}
.cc-a p{background:linear-gradient(135deg,#6a50d8,#8566f0);color:#fff;border-radius:14px 4px 14px 14px;box-shadow:0 8px 20px -10px #6a50d8cc}
.cc-a{flex-direction:row-reverse}
.cc-acts{display:flex;flex-wrap:wrap;gap:5px;padding-left:29px}
.cc-act{display:inline-flex;align-items:center;gap:5px;height:21px;padding:0 9px 0 6px;border-radius:99px;font-size:9px;font-weight:500;color:#ffe3b4;background:#ffc97a1a;box-shadow:inset 0 0 0 1px #ffc97a3a;opacity:0;transform:translateY(5px) scale(.96);transition:opacity .4s ease,transform .5s cubic-bezier(.16,1,.3,1)}
.cc-act.on{opacity:1;transform:none}
.cc-act u{text-decoration:none;width:11px;height:11px;border-radius:50%;background:#ffc97a;color:#3a2a08;display:grid;place-items:center;font-size:7px;font-weight:800}
.cc-book{display:flex;align-items:center;gap:10px;align-self:flex-end;padding:8px 14px 8px 9px;border-radius:13px;background:linear-gradient(135deg,#59e0a822,#59e0a80d);box-shadow:inset 0 0 0 1px #59e0a844,0 12px 26px -14px #59e0a8aa;opacity:0;transform:translateY(8px) scale(.97);transition:opacity .5s ease,transform .6s cubic-bezier(.16,1,.3,1)}
.cc-book.on{opacity:1;transform:none}
.cc-book u{text-decoration:none;flex:none;width:22px;height:22px;border-radius:50%;background:#59e0a8;color:#07261a;display:grid;place-items:center;font-size:11px;font-weight:800}
.cc-book b{display:block;font-size:11px;font-weight:600;color:#c9f7e2}.cc-book span{display:block;margin-top:3px;font-size:9px;color:#8fcbb3}
.cc-wave{flex:none;height:34px;display:flex;align-items:center;justify-content:center;gap:4px;margin-top:6px}
.cc-wave i{width:3px;height:30px;border-radius:3px;background:#5f7f86;transform:scaleY(.12);opacity:.7;transition:background .5s}
.cc-wave[data-s=listening] i{background:#59e0a8;opacity:1}
.cc-wave[data-s=speaking] i{background:#a99bff;opacity:1}
.cc-wave[data-s=thinking] i{background:#ffc97a;opacity:.9}

/* recap: the real Coceyo screen */
.cc-shotwin{position:relative;flex:1;min-height:0;margin-top:11px;border-radius:13px;overflow:hidden;background:#f4f3f7;box-shadow:0 0 0 1px #ffffff26,0 22px 40px -22px #000d}
.cc-shotworld{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform;--inv:1}
.cc-shot{display:block;width:100%;height:100%;user-select:none}
.cc-hl{position:absolute;border-radius:9px;opacity:0;transform:scale(.99);transition:opacity .45s ease,transform .6s cubic-bezier(.16,1,.3,1);box-shadow:0 0 0 calc(1.5px*var(--inv)) #7a56f5,0 0 0 calc(5px*var(--inv)) #7a56f524,0 calc(12px*var(--inv)) calc(30px*var(--inv)) calc(-10px*var(--inv)) #6a42f080;background:linear-gradient(110deg,#7c5cff00,#7c5cff12 50%,#7c5cff00)}
.cc-hl.on{opacity:1;transform:none}
.cc-hl .cc-tag{position:absolute;left:0;bottom:calc(100% + 5px*var(--inv));transform:scale(var(--inv));transform-origin:0 100%;white-space:nowrap;font:600 10px/1 Inter,system-ui,sans-serif;color:#fff;background:linear-gradient(135deg,#6a42f0,#8a5cf6);padding:6px 9px;border-radius:99px;box-shadow:0 6px 16px -4px #5a38d98c}
.cc-note{position:absolute;left:50%;bottom:11px;transform:translateX(-50%);margin:0;z-index:3;white-space:nowrap;font-size:9.5px;font-weight:500;color:#e8e1ff;background:#17101fd9;backdrop-filter:blur(12px);padding:7px 12px;border-radius:99px;box-shadow:0 12px 26px -10px #000a,inset 0 0 0 1px #ffffff1f}
.cc-note i{font-style:normal;color:#b9a3ff;margin-right:2px}

@media(max-width:800px){
 .app-call .application-visual{inset:204px 0 72px}
 .cc-film{inset:0 18px}.cc-console{border-radius:16px}
 .cc-scene{padding:12px 12px 10px}
 .cc-clock span{display:none}
 .cc-body{grid-template-columns:1fr;grid-template-rows:128px 1fr;gap:2px}
 .cc-orb{width:210px;height:210px;margin:-105px 0 0 -105px}.cc-orbring{width:126px;height:126px;box-shadow:0 0 0 9px #ffffff05}
 .cc-talk{gap:5px}.cc-msg p{font-size:10px;padding:5px 9px}.cc-acts{padding-left:0}.cc-act{font-size:8px;height:19px}
 .cc-wave{height:30px;gap:3px}.cc-wave i:nth-child(n+40){display:none}
 .cc-caller span{display:none}.cc-badge span{font-size:9px}
}
@media(prefers-reduced-motion:reduce){.cc-clock>i,.cc-orbring{animation:none!important}.cc-scene,.cc-msg,.cc-act,.cc-book,.cc-hl{transition:none}}
.cc-static *,.cc-static *::before,.cc-static *::after{transition:none!important;animation:none!important}
@media(max-width:800px){.cc-msg.past,.cc-acts .cc-act.past{display:none}.cc-acts:has(.cc-act:not(.on)){}}