/* Space LIVE: «☎» next to LIVE and the dock with the person on the line. Prefix sl-. */
.space-command #command-call{position:relative;width:52px;display:flex;align-items:center;justify-content:center;font-size:19px;border-color:#6a5f95;background:linear-gradient(135deg,#221c3c,#17303a);color:#d9ccff;transition:background .25s,box-shadow .25s,transform .25s}
.space-command #command-call:hover{transform:translateY(-2px);box-shadow:0 0 18px #a487f455}
.sl-call-dot{position:absolute;top:7px;right:8px;width:7px;height:7px;border-radius:50%;background:transparent}
/* manager icon: drawn strokes, voice waves that breathe on hover, wait in a loop and follow the voice level */
.sl-mgr{width:26px;height:26px;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.sl-mgr .mg-s{stroke-dasharray:1 1}
.sl-mgr .mg-ear{fill:currentColor;stroke:none}
.sl-mgr .mg-w{stroke:#6ff7d8;opacity:calc(.15 + 1.6 * var(--lvl,0));transform-origin:16px 11px;transition:opacity .2s}
.sl-mgr .mg-band{stroke:#c3a9fd}
#command-call:hover .mg-w,#command-call:focus-visible .mg-w{animation:slWave 1.1s ease-out infinite}
#command-call:hover .mg-w2{animation-delay:.18s}
#command-call:hover .mg-head{animation:slNod 1.1s ease-in-out infinite}
#command-call[data-state=waiting] .mg-w{animation:slWave 1s ease-out infinite;stroke:#c3a9fd}
#command-call[data-state=waiting] .mg-w2{animation-delay:.2s}
#command-call[data-state=active] .mg-band,#command-call[data-state=active] .mg-ear{stroke:#6ff7d8;fill:#6ff7d8}
#command-call[data-state=active] .mg-w{opacity:calc(.35 + 2 * var(--lvl,0))}
@keyframes slWave{0%{opacity:0;transform:translateX(-3px)}40%{opacity:1}100%{opacity:0;transform:translateX(3px)}}
@keyframes slNod{50%{transform:translateY(-.8px)}}
.sl-burst{position:absolute;inset:4px;border-radius:12px;border:1.5px solid #c3a9fd;pointer-events:none}
.sl-mgr.is-big{width:28px;height:28px;color:#e9e1ff}
.sl-mgr.is-big .mg-w{animation:slWave 1s ease-out infinite;stroke:#d9ccff}.sl-mgr.is-big .mg-w2{animation-delay:.2s}
#command-call[data-state=waiting] .sl-call-dot{background:#c3a9fd;box-shadow:0 0 10px #c3a9fd;animation:slBlink .6s infinite alternate}
#command-call[data-state=active]{border-color:#81f5d1;color:#bfffee}#command-call[data-state=active] .sl-call-dot{background:#6ff7d8;box-shadow:0 0 10px #6ff7d8}
@keyframes slBlink{to{opacity:.3}}

.sl-dock{--lvl:0;position:fixed;z-index:60;right:clamp(14px,3vw,48px);bottom:91px;width:min(370px,calc(100vw - 28px));padding:12px 15px 14px;color:#e6fbf5;background:linear-gradient(145deg,#08171dee,#071019f6 58%,#0c1522f8);border:1px solid #b9a0f8;border-radius:16px;box-shadow:0 12px 45px #000b,0 0 25px #a487f430;font:13px/1.45 Manrope,system-ui,sans-serif}
.sl-dock:before{content:'';position:absolute;inset:0;border-radius:16px;pointer-events:none;background-image:radial-gradient(#78cfbe32 .5px,transparent .5px);background-size:22px 22px;-webkit-mask-image:linear-gradient(to bottom,#0007,transparent 70%);mask-image:linear-gradient(to bottom,#0007,transparent 70%)}
.sl-dock[data-state=active]{border-color:#69e3c5;box-shadow:0 12px 45px #000b,0 0 calc(25px + 50px * var(--lvl)) rgb(67 225 189 / calc(.18 + .5 * var(--lvl)))}
.sl-dock.is-speaking{border-color:#9af8d8}
.sl-top{position:relative;display:flex;align-items:center;justify-content:space-between;font:700 9px/1 "JetBrains Mono",ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase}
.sl-brand{color:#9af8d8}.sl-brand b{margin-left:5px;color:#c3a9fd;font-weight:600}
.sl-iconbtn{width:25px;height:25px;border:1px solid #4c7174;border-radius:7px;background:#10272e;color:#d7fff3;font-size:16px;line-height:1;cursor:pointer}

/* the person: avatar with voice rings */
.sl-person{position:relative;display:flex;align-items:center;gap:12px;margin-top:10px}
.sl-avatar{--s:calc(1 + .55 * var(--lvl,0));position:relative;flex:none;width:52px;height:52px;display:grid;place-items:center}
.sl-avatar i{position:absolute;inset:0;border-radius:50%;border:1.5px solid #6ff7d866;transform:scale(var(--s));opacity:calc(.25 + var(--lvl,0));transition:transform .08s linear,opacity .08s linear}
.sl-avatar i+i{border-color:#b9a4ff55;transform:scale(calc(1 + 1.1 * var(--lvl,0)));opacity:calc(.6 * var(--lvl,0))}
.sl-avatar b{position:relative;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font:700 15px/1 Manrope,system-ui,sans-serif;color:#04211a;background:radial-gradient(circle at 35% 30%,#bfffee,#3fdcb4 55%,#14705f);box-shadow:0 0 calc(12px + 30px * var(--lvl,0)) #6ff7d8aa,inset 0 0 10px #ffffff55}
.sl-dock[data-state=waiting] .sl-avatar b{color:#e9e1ff;font-size:20px;overflow:visible;background:radial-gradient(circle,#6b55c4,#2a1f55 70%);box-shadow:0 0 22px #a487f488}
.sl-dock[data-state=waiting] .sl-avatar i{animation:slRing 2.6s cubic-bezier(.2,.6,.3,1) infinite;border-color:#b9a4ff77;opacity:1}
.sl-dock[data-state=waiting] .sl-avatar i+i{animation-delay:1.3s}
@keyframes slRing{from{transform:scale(.8);opacity:1}to{transform:scale(1.6);opacity:0}}
.sl-dock.is-speaking .sl-avatar b{animation:slTalk .5s ease-in-out infinite alternate}
@keyframes slTalk{to{filter:brightness(1.25)}}
.sl-who{min-width:0;flex:1;display:grid;gap:1px}
.sl-who strong{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sl-state{font-size:12px;color:#8be5cc}
.sl-dock.is-speaking .sl-state{color:#bfffee;font-weight:600}
.sl-dock:not(.is-online)[data-state=active] .sl-avatar b{filter:grayscale(.7) brightness(.7)}
.sl-timer{font:300 22px "JetBrains Mono",ui-monospace,monospace;color:#fff}
.sl-eye{display:block;font:700 9px "JetBrains Mono",ui-monospace,monospace;letter-spacing:.12em;color:#8be5cc}

.sl-body{position:relative;display:grid;gap:9px;margin-top:12px}
.sl-share{display:flex;gap:12px;align-items:center}
.sl-qr{flex:none;width:96px;height:96px;padding:5px;border-radius:10px;background:#fff;box-shadow:0 0 22px #6ff7d833}
.sl-qr svg{display:block;width:100%;height:100%}
.sl-share-info{display:grid;gap:5px;font-size:12px;color:#b6c8cf}
.sl-btn{min-height:38px;padding:0 13px;border-radius:10px;font:600 13px Manrope,system-ui,sans-serif;cursor:pointer}
.sl-btn-t{border:1px solid #6ff7d866;background:#6ff7d812;color:#9ff9d9}
.sl-btn-ghost{border:1px solid #ffffff22;background:none;color:#b6c8cf}
.sl-dock[data-voice=on] .sl-acts .sl-btn-t{border-color:#ff9c9c77;color:#ffc4c4;background:#ff6b6b14}
.sl-dock[data-voice=ring] .sl-acts .sl-btn-t{background:#6ff7d8;color:#04211a;animation:slBlink .6s infinite alternate}
.sl-feed{max-height:180px;overflow-y:auto;display:flex;flex-direction:column;gap:6px;scrollbar-width:thin}
.sl-feed:empty{display:none}
.sl-msg{max-width:88%;padding:6px 10px;border-radius:11px;background:#0f1d27;box-shadow:inset 3px 0 0 var(--c,#ffffff22)}
.sl-msg small{display:block;font:700 9px "JetBrains Mono",ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--c,#8aa1ad)}
.sl-msg p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.sl-msg.is-me{align-self:flex-end;background:#13232e;box-shadow:inset -3px 0 0 var(--c,#ffffff22)}
.sl-from-client{--c:#b9a4ff}.sl-from-manager{--c:#6ff7d8}
.sl-from-system{align-self:center;background:none;box-shadow:none;padding:0}.sl-from-system p{font:11px "JetBrains Mono",ui-monospace,monospace;color:#6f8893;text-align:center}
.sl-typing{min-height:14px;font:10px "JetBrains Mono",ui-monospace,monospace;color:#8aa1ad}.sl-typing:empty{display:none}
.sl-compose{display:flex;gap:6px;padding:4px;border-radius:12px;background:#050c11;box-shadow:inset 0 0 0 1px #6ff7d833}
.sl-compose input{flex:1;min-width:0;min-height:38px;padding:0 8px;border:0;background:none;color:#e9f3f6;font:16px Manrope,system-ui,sans-serif;outline:none}
.sl-send{flex:none;width:40px;border:0;border-radius:9px;background:#6ff7d8;color:#04211a;font-size:17px;font-weight:700;cursor:pointer}
.sl-acts{display:flex;gap:8px}.sl-acts .sl-btn{flex:1}
.sl-note{margin:0;font-size:12px;color:#ffd9a6}

/* minimised: only the person stays, still pulsing with the voice */
.sl-dock.is-min{width:auto;max-width:calc(100vw - 28px);padding:8px 12px;cursor:pointer}
.sl-dock.is-min .sl-top,.sl-dock.is-min .sl-body,.sl-dock.is-min .sl-timer{display:none}
.sl-dock.is-min .sl-person{margin:0}.sl-dock.is-min .sl-avatar{width:40px;height:40px}.sl-dock.is-min .sl-avatar b{width:34px;height:34px;font-size:13px}

/* «зовут менеджера» card for managers in Space */
.sl-callcard{position:fixed;z-index:70;top:16px;right:16px;display:flex;align-items:center;gap:12px;width:min(440px,calc(100vw - 32px));padding:12px 14px;color:#e6fbf5;background:#08171df4;border:1px solid #b9a0f8;border-radius:16px;box-shadow:0 18px 50px #000c,0 0 30px #a487f440;font:13px Manrope,system-ui,sans-serif}
.sl-callcard .sl-avatar i{animation:slRing 2.2s cubic-bezier(.2,.6,.3,1) infinite;border-color:#b9a4ff77;opacity:1}.sl-callcard .sl-avatar i+i{animation-delay:1.1s}
.sl-callcard .sl-avatar b{color:#e9e1ff;font-size:20px;background:radial-gradient(circle,#6b55c4,#2a1f55 70%)}
.sl-toast{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom));z-index:75;max-width:calc(100% - 32px);padding:10px 15px;border-radius:13px;background:#0a151df2;color:#e6fbf5;box-shadow:inset 0 0 0 1px #6ff7d866,0 14px 40px #000a;font:13.5px Manrope,system-ui,sans-serif;transform:translateX(-50%)}
.space-guest-manager .sidebar-bottom:after{content:' · гость по ссылке';color:#c3a9fd}

@media(max-width:760px){
  .space-command #command-call{width:44px;font-size:16px;padding:0 3px}
  .sl-dock{left:10px;right:10px;bottom:calc(132px + env(safe-area-inset-bottom));width:auto;padding:10px 12px 12px;border-radius:13px}
  .sl-dock.is-min{left:auto}
  .sl-feed{max-height:120px}
  .sl-callcard{top:10px;right:10px;left:10px;width:auto}
}
@media(prefers-reduced-motion:reduce){.sl-dock *,.sl-callcard *,#command-call *{animation:none!important;transition:none!important}}

/* where the other person clicked */
.sl-flash{position:fixed;z-index:65;pointer-events:none;border-radius:12px;box-shadow:0 0 0 2px #c3a9fd,0 0 26px #a487f488}
/* «Перезвоните мне» inside the waiting dock */
.sl-cb{display:grid;gap:8px;margin:2px 0 8px}
.sl-cb-open{width:100%;justify-content:center;gap:8px;font-weight:800}
.sl-cb-form{display:grid;gap:8px;padding:12px;border-radius:14px;background:#6ff7d80d;border:1px solid #6ff7d833}
.sl-cb-phone{height:46px;padding:0 14px;border-radius:12px;border:1px solid #ffffff22;background:#0b1a20;color:#fff;font:600 16px Manrope,sans-serif;outline:none}
.sl-cb-phone:focus{border-color:#6ff7d8;box-shadow:0 0 0 3px #6ff7d822}
.sl-cb-go{height:46px;justify-content:center;border:0;background:linear-gradient(135deg,#6ff7d8,#47d6b4);color:#06231c;font-weight:800}
.sl-cb-go:disabled{opacity:.6}
.sl-cb-msg{margin:0;min-height:0;color:#ffb4a8;font-size:12.5px}.sl-cb-msg:empty{display:none}
.sl-cb-ok{display:flex;gap:12px;align-items:center;padding:12px;border-radius:14px;background:#6ff7d814;border:1px solid #6ff7d855}
.sl-cb-ok b{display:block;color:#eafff9;font-size:15px}.sl-cb-ok small{color:#a9cfc6;font-size:12.5px;line-height:1.4}
.sl-cb-check{flex:none;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#6ff7d8;color:#06231c;font-weight:900}