.demo-frame{--d-bg:#fff;--d-soft:#f5f6fb;--d-line:#1c1f3314;--d-ink:#1c1f33;--d-mute:#5b5f78;--d-accent:#343f75;--d-accent-2:#5a67a8;background:var(--d-bg);color:var(--d-ink);border:1px solid var(--d-line);border-radius:1.25rem;font-size:14px;position:relative;overflow:hidden;box-shadow:0 40px 90px -45px #343f758c}.demo-frame-dark{--d-bg:#20243b;--d-soft:#2a2f4d;--d-line:#ffffff14;--d-ink:#eef0f8;--d-mute:#a9b2dc;--d-accent:#c3c9ea;--d-accent-2:#7f8ac4;box-shadow:0 50px 100px -40px #0009}.demo-frame-bar{border-bottom:1px solid var(--d-line);background:var(--d-soft);align-items:center;gap:6px;padding:10px 14px;display:flex}.demo-frame-bar>span{background:color-mix(in oklab, var(--d-mute) 30%, transparent);border-radius:99px;width:10px;height:10px}.demo-frame-bar em{color:var(--d-mute);margin-left:auto;font-size:11px;font-style:normal}.demo-pop{animation:pop .38s var(--ease) both}.demo-slide{animation:slide-in .38s var(--ease) both}@keyframes demo-dot{0%,80%,to{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}.demo-typing{gap:4px;padding:2px 0;display:inline-flex}.demo-typing i{background:currentColor;border-radius:99px;width:6px;height:6px;animation:1s infinite demo-dot}.demo-typing i:nth-child(2){animation-delay:.15s}.demo-typing i:nth-child(3){animation-delay:.3s}.demo-chat{background:linear-gradient(180deg, color-mix(in oklab, var(--d-soft) 70%, var(--d-bg)), var(--d-bg));border-right:1px solid var(--d-line);flex-direction:column;height:460px;display:flex}.demo-chat-head{border-bottom:1px solid var(--d-line);align-items:center;gap:10px;padding:12px 16px;display:flex}.demo-avatar{color:#fff;background:linear-gradient(135deg,#343f75,#5a67a8);border-radius:99px;flex:none;justify-content:center;align-items:center;width:34px;height:34px;font-size:12px;font-weight:700;display:inline-flex}.demo-avatar-lead{background:linear-gradient(135deg,#7f8ac4,#a9b2dc)}.demo-chat-body{flex-direction:column;flex:1;justify-content:flex-end;gap:8px;min-height:0;padding:16px;display:flex;overflow:hidden}.demo-chat-body>*{flex:none}.demo-bubble{max-width:86%;animation:pop .32s var(--ease) both;transform-origin:0 100%;border-radius:16px;padding:9px 12px;line-height:1.4}.demo-lead{transform-origin:100% 100%;color:#fff;background:linear-gradient(135deg,#343f75,#5a67a8);border-bottom-right-radius:5px;align-self:flex-end}.demo-ai{background:var(--d-bg);border:1px solid var(--d-line);border-bottom-left-radius:5px;align-self:flex-start;box-shadow:0 6px 18px -12px #1c1f334d}.demo-typing-bubble{color:var(--d-mute)}.demo-quick{color:var(--d-accent);border:1px solid color-mix(in oklab, var(--d-accent) 30%, transparent);transition:all .25s var(--ease);border-radius:99px;padding:4px 10px;font-size:12px;font-weight:600;display:inline-flex}.demo-quick-on{color:#fff;background:var(--d-accent-2);border-color:#0000;transform:scale(1.05)}.demo-crm{flex-direction:column;gap:14px;padding:18px;display:flex}.demo-badge{white-space:nowrap;color:var(--d-accent);background:color-mix(in oklab, var(--d-accent) 12%, transparent);border-radius:99px;align-items:center;gap:4px;padding:4px 9px;font-size:11px;font-weight:600;display:inline-flex}.demo-stages{gap:6px;display:flex}.demo-stages span{color:var(--d-mute);background:var(--d-soft);transition:all .4s var(--ease);border-radius:10px;flex:1;justify-content:center;align-items:center;gap:3px;padding:6px 4px;font-size:11px;font-weight:600;display:inline-flex}.demo-stages span.on{color:#fff;background:linear-gradient(135deg,#343f75,#5a67a8)}.demo-facts{background:var(--d-line);border:1px solid var(--d-line);border-radius:12px;gap:1px;display:grid;overflow:hidden}.demo-fact{background:var(--d-bg);justify-content:space-between;gap:12px;padding:8px 12px;font-size:13px;transition:background .4s;display:flex}.demo-fact dt{color:var(--d-mute);flex:none;align-items:center;gap:5px;display:inline-flex}.demo-fact dd{text-align:right;color:var(--d-mute)}.demo-fact.on dd{color:var(--d-ink);font-weight:600;animation:.4s both fade}.demo-fact.on{background:color-mix(in oklab, var(--d-accent) 6%, var(--d-bg))}.demo-summary{background:var(--d-soft);border:1px dashed color-mix(in oklab, var(--d-accent) 35%, transparent);border-radius:12px;padding:12px;transition:opacity .3s}.demo-board{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;min-height:300px;padding:16px 16px 60px;display:grid}.demo-col{background:var(--d-soft);border-radius:14px;flex-direction:column;gap:8px;padding:10px;display:flex}.demo-col-head{color:var(--d-mute);justify-content:space-between;font-size:12px;font-weight:700;display:flex}.demo-col-head span{text-align:center;background:var(--d-bg);border-radius:99px;min-width:20px;padding:0 6px}.demo-card{background:var(--d-bg);border:1px solid var(--d-line);border-radius:10px;padding:9px 10px;font-size:12px}.demo-card-hot{color:#fff;background:linear-gradient(135deg,#343f75,#5a67a8);border:none;box-shadow:0 12px 24px -12px #343f75cc}.demo-toast{z-index:30;text-align:center;color:#fff;opacity:0;width:max-content;max-width:calc(100% - 32px);transition:opacity .3s, transform .35s var(--ease);pointer-events:none;background:#1c1f33;border-radius:99px;justify-content:center;align-items:center;gap:6px;margin-inline:auto;padding:8px 14px;font-size:12px;font-weight:600;display:flex;position:absolute;bottom:16px;left:0;right:0;transform:translateY(8px)}.demo-toast-on{opacity:1;transform:none}.demo-frame-dark .demo-toast{color:#1c1f33;background:#eef0f8}.demo-phone{background:#1c1f33;border-radius:42px;width:100%;max-width:300px;margin:0 auto;padding:12px;position:relative;box-shadow:0 40px 80px -30px #1c1f33b3}.demo-phone-notch{z-index:1;background:#1c1f33;border-radius:99px;width:90px;height:22px;position:absolute;top:18px;left:50%;transform:translate(-50%)}.demo-phone-screen{color:#1c1f33;background:linear-gradient(#f5f6fb,#fff);border-radius:32px;flex-direction:column;gap:12px;min-height:520px;padding:46px 16px 18px;font-size:14px;display:flex}.demo-call-card{background:#fff;border:1px solid #1c1f3314;border-radius:18px;padding:14px;box-shadow:0 10px 24px -16px #343f7580}.demo-call-btn{color:#fff;background:linear-gradient(135deg,#343f75,#5a67a8);border-radius:16px;justify-content:center;align-items:center;gap:8px;width:100%;padding:14px;font-weight:700;display:flex}@keyframes demo-ring{0%{box-shadow:0 0 #5a67a880}to{box-shadow:0 0 0 14px #5a67a800}}.demo-pulse{animation:1.2s infinite demo-ring}.demo-calling{color:#343f75;background:#343f751a;border-radius:16px;justify-content:center;align-items:center;gap:8px;padding:14px;font-weight:600;animation:.3s both fade;display:flex}.demo-outcome{text-align:center;color:#5b5f78;animation:pop .3s var(--ease) both;background:#fff;border:1px solid #1c1f331a;border-radius:12px;padding:10px 4px;font-size:12px;font-weight:600}.demo-outcome.on{color:#fff;background:#343f75;border-color:#0000}.demo-logged{text-align:center;color:#343f75;font-size:12px;font-weight:600;transition:opacity .3s}.demo-next{background:#fff;border:1px solid #1c1f330f;border-radius:12px;justify-content:space-between;padding:9px 12px;font-size:13px;display:flex}.demo-dash{flex-direction:column;gap:12px;padding:16px;display:flex}.demo-kpis{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;display:grid}.demo-kpi{background:var(--d-soft);border-radius:14px;padding:12px}.demo-kpi p{color:var(--d-mute);font-size:11px}.demo-kpi b{letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin-top:4px;font-size:22px;font-weight:700;display:block}.demo-panel{border:1px solid var(--d-line);border-radius:14px;flex-direction:column;gap:8px;padding:12px;display:flex}.demo-panel-head{color:var(--d-mute);align-items:center;gap:5px;font-size:12px;font-weight:700;display:inline-flex}.demo-bar-row{grid-template-columns:92px 1fr 34px;align-items:center;gap:8px;font-size:12px;display:grid}.demo-bar{background:var(--d-soft);border-radius:99px;height:8px;overflow:hidden}.demo-bar i{border-radius:inherit;height:100%;transition:width 1.1s var(--ease);background:linear-gradient(90deg,#343f75,#5a67a8);display:block}.demo-frame-dark .demo-bar i{background:linear-gradient(90deg,#7f8ac4,#c3c9ea)}.demo-bar-row b{text-align:right;font-variant-numeric:tabular-nums}.demo-leader{animation:slide-in .4s var(--ease) both;align-items:center;gap:8px;font-size:12px;display:flex}.demo-rank{color:#fff;background:var(--d-accent-2);border-radius:99px;justify-content:center;align-items:center;width:20px;height:20px;font-size:11px;font-weight:700;display:inline-flex}@media (max-width:640px){.demo-kpis,.demo-board{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-chat{border-right:0;border-bottom:1px solid var(--d-line);height:420px}}@media (prefers-reduced-motion:reduce){.demo-frame *,.demo-phone *{transition:none!important;animation:none!important}}.demo-cursor{z-index:25;pointer-events:none;filter:drop-shadow(0 4px 8px #0000004d);transition:transform .7s cubic-bezier(.45,.05,.25,1);position:absolute;top:0;left:0}.demo-cursor svg{z-index:2;transition:transform .15s var(--ease);margin:-4px 0 0 -5px;position:relative}.demo-cursor[data-mode=press] svg,.demo-cursor[data-mode=click] svg{transform:scale(.86)}.demo-cursor-ring{opacity:0;border:2px solid #5a67a8;border-radius:99px;width:32px;height:32px;position:absolute;top:-16px;left:-16px;transform:scale(.3)}@keyframes demo-hold{0%{opacity:.9;transform:scale(.35)}to{opacity:.9;transform:scale(1)}}@keyframes demo-ripple{0%{opacity:.8;transform:scale(.3)}to{opacity:0;transform:scale(1.5)}}.demo-cursor[data-mode=press] .demo-cursor-ring{background:#5a67a826;animation:.45s linear both demo-hold}.demo-cursor[data-mode=click] .demo-cursor-ring{animation:.5s ease-out both demo-ripple}.demo-cursor-carry{z-index:1;width:168px;animation:pop .2s var(--ease) both;position:absolute;top:-18px;left:-40px;transform:rotate(3deg)scale(1.04)}.demo-card-carried{box-shadow:0 24px 40px -14px #0000008c}.demo-col{transition:background-color .25s, border-color .25s, transform .25s var(--ease);border:1px solid #0000}.demo-col-over{border-color:color-mix(in oklab, var(--stage,#5a67a8) 70%, transparent);background:color-mix(in oklab, var(--stage,#5a67a8) 16%, var(--d-soft));transform:translateY(-2px)}.demo-card-ghosted{opacity:.3;outline:2px dashed color-mix(in oklab, var(--d-accent) 60%, transparent);outline-offset:-2px}@keyframes demo-glow{0%{box-shadow:0 0 #a9b2dccc}to{box-shadow:0 0 0 12px #a9b2dc00}}.demo-card-fresh{animation:pop .35s var(--ease) both, demo-glow 1.2s ease-out .2s 2}.demo-mini-btn{color:var(--d-ink);background:color-mix(in oklab, var(--d-ink) 8%, transparent);border-radius:8px;align-items:center;gap:3px;margin-top:6px;padding:3px 8px;font-size:11px;font-weight:600;transition:opacity .2s;display:inline-flex}.demo-card-hot .demo-mini-btn{color:#1c1f33;background:#fff}.demo-moved{opacity:.85;margin-top:4px;font-size:10px;font-weight:700;display:block}.demo-team{flex-direction:column;gap:8px;min-height:330px;padding:16px 16px 64px;display:flex}.demo-person{background:var(--d-soft);border-radius:14px;align-items:center;gap:10px;padding:10px 12px;transition:opacity .4s,filter .4s;display:flex}.demo-person .demo-mini-btn{margin-top:0}.demo-person-off{opacity:.45;filter:grayscale()}.demo-switch{background:color-mix(in oklab, var(--d-mute) 40%, transparent);border-radius:99px;flex:none;width:34px;height:20px;transition:background-color .25s;position:relative}.demo-switch i{width:14px;height:14px;transition:transform .25s var(--ease);background:#fff;border-radius:99px;position:absolute;top:3px;left:3px}.demo-switch.on{background:#5a67a8}.demo-switch.on i{transform:translate(14px)}.demo-sheet{border:1px dashed color-mix(in oklab, var(--d-accent) 40%, transparent);opacity:0;transition:opacity .3s, transform .3s var(--ease);border-radius:14px;padding:12px;transform:translateY(6px)}.demo-sheet-open{opacity:1;transform:none}.demo-sit{flex-direction:column;gap:12px;min-height:330px;padding:18px;display:flex}.demo-frame .demo-call-card{background:var(--d-bg);color:var(--d-ink);border-color:var(--d-line)}.demo-clock{font-variant-numeric:tabular-nums;color:var(--d-accent);background:color-mix(in oklab, var(--d-accent) 12%, transparent);border-radius:99px;align-items:center;gap:4px;padding:4px 9px;font-size:12px;font-weight:700;transition:color .3s,background-color .3s,opacity .3s;display:inline-flex}.demo-clock-late{color:#fff;background:#b4536a}.demo-clock-bar{background:var(--d-soft);border-radius:99px;height:4px;margin-top:12px;overflow:hidden}.demo-clock-bar i{background:linear-gradient(90deg,#5a67a8,#b4536a);height:100%;transition:width .6s linear;display:block}.demo-note{background:var(--d-soft);border-radius:12px;align-items:center;gap:8px;padding:10px 12px;font-size:13px;transition:opacity .3s;display:flex}.demo-note-good{background:color-mix(in oklab, #5a67a8 18%, var(--d-soft))}
