/* kc-call-summary.css - KaiCalls motion kit */
.kc{--kc-blue:#2563EB;--kc-blue-soft:color-mix(in srgb,var(--kc-blue) 10%,transparent);--kc-bg:#F8FAFC;--kc-paper:#FFFFFF;--kc-sunk:#F3F5F9;--kc-text:#0B1220;--kc-mut:#64748B;--kc-line:rgba(11,18,32,.08);--kc-ok:#15803D;--kc-ok-soft:rgba(21,128,61,.1);--kc-warm:#B45309;--kc-warm-soft:rgba(180,83,9,.1);--kc-hot:#C2410C;--kc-hot-soft:rgba(194,65,12,.1);--kc-shadow:0 0 0 1px var(--kc-line),0 1px 2px rgba(11,18,32,.05),0 4px 12px -2px rgba(11,18,32,.06),0 20px 40px -12px rgba(11,18,32,.14);--kc-shadow-s:0 0 0 1px var(--kc-line),0 1px 2px rgba(11,18,32,.05),0 3px 8px -2px rgba(11,18,32,.06);--kc-ease:cubic-bezier(.16,1,.3,1);--kc-disp:var(--font-space-grotesk,inherit);position:relative;width:100%;font-family:inherit;color:var(--kc-text);line-height:1.45;-webkit-font-smoothing:antialiased;font-size:15px}.kc[data-theme=dark],html.dark .kc:not([data-theme=light]){--kc-blue:#5C8CFF;--kc-bg:#0B1220;--kc-paper:#121A2A;--kc-sunk:#0E1524;--kc-text:#F1F5F9;--kc-mut:#94A3B8;--kc-line:rgba(255,255,255,.08);--kc-ok:#4ADE80;--kc-ok-soft:rgba(74,222,128,.12);--kc-warm:#FBBF24;--kc-warm-soft:rgba(251,191,36,.12);--kc-hot:#FB923C;--kc-hot-soft:rgba(251,146,60,.13);--kc-shadow:0 0 0 1px var(--kc-line),0 1px 2px rgba(0,0,0,.3),0 8px 24px -4px rgba(0,0,0,.35),0 24px 48px -16px rgba(0,0,0,.45);--kc-shadow-s:0 0 0 1px var(--kc-line),0 2px 6px rgba(0,0,0,.25)}.kc *,.kc *::before,.kc *::after{box-sizing:border-box}.kc .kc-alt{margin:0;color:var(--kc-mut)}.kc.kc-ready .kc-alt{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.kc-card{background:var(--kc-paper);border-radius:20px;box-shadow:var(--kc-shadow)}.kc-av{flex:none;display:inline-grid;place-items:center;width:2.25em;height:2.25em;border-radius:50%;font-weight:600;font-size:.9em;background:var(--kc-sunk);color:var(--kc-text);box-shadow:inset 0 0 0 1px var(--kc-line)}.kc-av--k{background:var(--kc-blue);color:#fff;box-shadow:none}.kc-chip{display:inline-flex;align-items:center;gap:.4em;font-size:.76em;font-weight:600;line-height:1;padding:.45em .7em;border-radius:8px;background:var(--kc-sunk);color:var(--kc-mut);white-space:nowrap}.kc-chip i{width:.45em;height:.45em;border-radius:50%;background:currentColor}.kc-chip--ok{background:var(--kc-ok-soft);color:var(--kc-ok)}.kc-chip--blue{background:var(--kc-blue-soft);color:var(--kc-blue)}.kc-chip--warm{background:var(--kc-warm-soft);color:var(--kc-warm)}.kc-chip--hot{background:var(--kc-hot-soft);color:var(--kc-hot)}.kc-num{font-family:var(--kc-disp);font-variant-numeric:tabular-nums;letter-spacing:-.01em}.kc-mut{color:var(--kc-mut)}.kc-ic{width:1em;height:1em;flex:none;vertical-align:-.125em}.kc-tick{color:var(--kc-ok)}.kc-tick path{stroke-dasharray:24;stroke-dashoffset:24;transition:stroke-dashoffset .5s var(--kc-ease) .1s}.is-on>.kc-tick path,.is-on .kc-tick path{stroke-dashoffset:0}.kc-eq{display:inline-flex;gap:2px;align-items:center;height:.9em}.kc-eq i{width:2px;height:100%;border-radius:1px;background:currentColor;transform:scaleY(.3);animation:kc-eq .9s var(--kc-ease) infinite alternate}.kc-eq i:nth-child(2){animation-delay:-.3s}.kc-eq i:nth-child(3){animation-delay:-.6s}.kc-eq i:nth-child(4){animation-delay:-.15s}@keyframes kc-eq{to{transform:scaleY(1)}}.kc-paused,.kc-paused *,.kc-paused *::before,.kc-paused *::after{animation-play-state:paused!important}.kc-static *,.kc-static *::before,.kc-static *::after{transition:none!important;animation:none!important}@media (prefers-reduced-motion:reduce){.kc *,.kc *::before,.kc *::after{transition:none!important;animation:none!important}}
.kc-summary{container-type:inline-size;max-width:480px;margin-inline:auto}.kc-summary:not(.kc-ready){min-height:470px}.cs-stage{position:relative;height:470px}.cs-call{position:absolute;inset:4px 4px auto;padding:16px 18px 18px;opacity:0;transform:translateY(14px);transition:opacity .6s var(--kc-ease),transform .8s var(--kc-ease)}.cs-call.is-in{opacity:1;transform:none}.cs-call.is-back{opacity:.5;transform:translateY(-4px) scale(.95)}.cs-top{display:flex;align-items:center;gap:10px;font-size:.86em;margin-bottom:14px}.cs-top b{font-weight:600;font-size:1.08em}.cs-top .kc-chip{margin-left:auto}.cs-lines{display:flex;flex-direction:column;gap:8px;transition:opacity .6s}.is-dim .cs-lines{opacity:.38}.cs-b{max-width:84%;padding:9px 12px;border-radius:12px;background:var(--kc-sunk);font-size:.9em;line-height:1.4;opacity:0;transform:translateY(8px);transition:opacity .45s var(--kc-ease),transform .6s var(--kc-ease)}.cs-b.is-on{opacity:1;transform:none}.cs-b.k{align-self:flex-end;background:var(--kc-blue-soft);border-bottom-right-radius:8px}.cs-b:not(.k){border-bottom-left-radius:8px}.cs-b em{display:block;font-style:normal;font-size:.78em;font-weight:600;color:var(--kc-mut);margin-bottom:2px}.cs-sum,.cs-slot{border-radius:12px;padding:10px 12px;background:var(--kc-paper);box-shadow:var(--kc-shadow-s)}.cs-sum{position:absolute;left:28px;right:28px;top:150px;opacity:0;transform:scale(.96);transition:opacity .45s var(--kc-ease),transform .9s var(--kc-ease)}.cs-sum.is-on{opacity:1;transform:none}.cs-sum.is-gone{opacity:0;transition-duration:.2s}.cs-sum small,.cs-slot small{display:block;font-size:.76em;font-weight:600;color:var(--kc-blue);margin-bottom:2px}.cs-sum p,.cs-slot p{margin:0;font-size:.92em;line-height:1.4}.cs-lead{position:absolute;inset:auto 4px 4px;padding:16px 18px;opacity:0;transform:translateY(26px);transition:opacity .6s var(--kc-ease),transform .8s var(--kc-ease)}.cs-lead.is-in{opacity:1;transform:none}.cs-who{display:flex;align-items:center;gap:12px;margin-bottom:12px}.cs-who b{display:block;font-weight:600}.cs-who small{font-size:.84em;color:var(--kc-mut)}.cs-score{margin-left:auto;position:relative;opacity:0;transform:translateY(4px);transition:opacity .4s var(--kc-ease),transform .5s var(--kc-ease)}.cs-score.is-on{opacity:1;transform:none}.cs-slot{background:var(--kc-sunk);box-shadow:none;opacity:0}.cs-slot.is-on{opacity:1}.cs-foot{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:.84em;color:var(--kc-mut);opacity:0;transition:opacity .4s}.cs-foot.is-on{opacity:1}@container (max-width:380px){.kc-summary{font-size:14px}.cs-call,.cs-lead{padding-inline:14px}.cs-sum{left:18px;right:18px}}
