/* HealSom call engine UI — shared by the patient app and the doctor panel */
.hsc-root{--hsc-bg:#0b1020;--hsc-bg2:#141a33;--hsc-glass:rgba(255,255,255,.12);--hsc-glass-b:rgba(255,255,255,.18);--hsc-text:#f8fafc;--hsc-muted:rgba(248,250,252,.68);--hsc-green:#22c55e;--hsc-red:#ef4444;--hsc-primary:#1151AB;
  position:fixed;inset:0;z-index:2147483000;font-family:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--hsc-text);background:var(--hsc-bg);overflow:hidden;
  -webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;animation:hsc-in .28s cubic-bezier(.2,.8,.2,1)}
.hsc-root *{box-sizing:border-box}
.hsc-root.hsc-docked{position:absolute;border-radius:20px;animation:none;z-index:5}
@keyframes hsc-in{from{opacity:0;transform:scale(1.02)}to{opacity:1;transform:none}}
.hsc-root.hsc-out{animation:hsc-outk .25s ease forwards}
@keyframes hsc-outk{to{opacity:0;transform:scale(.98)}}

/* Backdrop */
.hsc-bgimg{position:absolute;inset:-40px;background-size:cover;background-position:center;filter:blur(38px) saturate(1.2);opacity:.55;transform:scale(1.1)}
.hsc-bggrad{position:absolute;inset:0;background:radial-gradient(120% 80% at 50% 0%,rgba(17,81,171,.45),transparent 60%),radial-gradient(90% 60% at 100% 100%,rgba(20,184,166,.28),transparent 60%),linear-gradient(180deg,rgba(11,16,32,.25),rgba(11,16,32,.85))}

/* Stage: remote media */
.hsc-stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#05070f}
.hsc-remote{width:100%;height:100%;object-fit:cover;background:#05070f}
.hsc-docked .hsc-remote,.hsc-fit .hsc-remote{object-fit:contain}
.hsc-stage .hsc-ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:linear-gradient(160deg,#071E45,#0b1020 60%,#042f2e)}
.hsc-ph .hsc-avatar{width:112px;height:112px;font-size:38px}
.hsc-ph small{color:var(--hsc-muted);font-size:13px;display:flex;align-items:center;gap:6px}

/* Avatar */
.hsc-avatar{border-radius:50%;display:grid;place-items:center;font-weight:800;color:#fff;background:linear-gradient(135deg,#4F86D6,#14b8a6);background-size:cover;background-position:center;box-shadow:0 18px 50px -12px rgba(0,0,0,.6);position:relative;flex:none}
.hsc-avatar.hsc-has-img{color:transparent}

/* Ring / call-setup screens */
.hsc-ring{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:calc(env(safe-area-inset-top,0px) + 56px) 24px calc(env(safe-area-inset-bottom,0px) + 40px);z-index:2;text-align:center}
.hsc-ring .hsc-top{display:flex;flex-direction:column;align-items:center;gap:10px}
.hsc-pill{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;background:var(--hsc-glass);border:1px solid var(--hsc-glass-b);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-size:12.5px;font-weight:600;letter-spacing:.02em}
.hsc-pill svg{width:15px;height:15px}
.hsc-who{margin-top:34px;display:flex;flex-direction:column;align-items:center;gap:6px}
.hsc-who .hsc-avatar{width:132px;height:132px;font-size:44px}
.hsc-who>.hsc-pulse,.hsc-who>.hsc-avatar{margin-bottom:18px}
.hsc-pulse{border-radius:50%}
.hsc-name{font-size:26px;font-weight:800;letter-spacing:-.01em;line-height:1.2}
.hsc-sub{font-size:14px;color:var(--hsc-muted)}
.hsc-status{font-size:14px;color:var(--hsc-muted);margin-top:6px;min-height:20px}
.hsc-pulse{position:relative}
.hsc-pulse::before,.hsc-pulse::after,.hsc-pulse>i{content:"";position:absolute;inset:-10px;border-radius:50%;border:2px solid rgba(165,180,252,.55);animation:hsc-ripple 2.4s cubic-bezier(.2,.6,.3,1) infinite;pointer-events:none}
.hsc-pulse::after{animation-delay:.8s}.hsc-pulse>i{animation-delay:1.6s}
@keyframes hsc-ripple{0%{transform:scale(.92);opacity:.9}100%{transform:scale(1.65);opacity:0}}
.hsc-actions{display:flex;justify-content:center;gap:64px;width:100%;max-width:360px}
.hsc-act{display:flex;flex-direction:column;align-items:center;gap:10px;font-size:13px;font-weight:600;color:var(--hsc-muted)}
.hsc-quick{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:26px;max-width:420px}
.hsc-quick button{font:inherit;font-size:12.5px;font-weight:600;color:#fff;background:var(--hsc-glass);border:1px solid var(--hsc-glass-b);border-radius:999px;padding:8px 13px;cursor:pointer;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.hsc-quick button:active{transform:scale(.97)}

/* Buttons */
.hsc-btn{width:60px;height:60px;border-radius:50%;border:0;display:grid;place-items:center;cursor:pointer;color:#fff;background:var(--hsc-glass);border:1px solid var(--hsc-glass-b);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:transform .15s ease,background .2s ease,box-shadow .2s ease;outline:none;flex:none}
.hsc-btn svg{width:26px;height:26px}
.hsc-btn:hover{background:rgba(255,255,255,.2)}
.hsc-btn:active{transform:scale(.92)}
.hsc-btn:focus-visible{box-shadow:0 0 0 3px rgba(165,180,252,.8)}
.hsc-btn.hsc-off{background:#fff;color:#0f172a;border-color:#fff}
.hsc-btn.hsc-big{width:72px;height:72px}.hsc-btn.hsc-big svg{width:30px;height:30px}
.hsc-btn.hsc-green{background:var(--hsc-green);border-color:var(--hsc-green);box-shadow:0 12px 30px -8px rgba(34,197,94,.7)}
.hsc-btn.hsc-red{background:var(--hsc-red);border-color:var(--hsc-red);box-shadow:0 12px 30px -8px rgba(239,68,68,.65)}
.hsc-btn.hsc-red:hover{background:#dc2626}.hsc-btn.hsc-green:hover{background:#16a34a}
.hsc-btn.hsc-wide{width:auto;padding:0 22px;border-radius:999px;gap:8px;display:inline-flex;align-items:center;font:inherit;font-weight:700;font-size:14px}
.hsc-btn.hsc-wide svg{width:22px;height:22px}
.hsc-btn.hsc-accept-anim{animation:hsc-wiggle 1.6s ease-in-out infinite}
@keyframes hsc-wiggle{0%,60%,100%{transform:rotate(0)}65%{transform:rotate(-14deg)}72%{transform:rotate(12deg)}79%{transform:rotate(-8deg)}86%{transform:rotate(5deg)}}

/* In-call chrome */
.hsc-topbar{position:absolute;left:0;right:0;top:0;padding:calc(env(safe-area-inset-top,0px) + 14px) 16px 40px;display:flex;align-items:flex-start;gap:12px;background:linear-gradient(180deg,rgba(2,6,23,.72),rgba(2,6,23,0));z-index:4;transition:opacity .3s ease,transform .3s ease}
.hsc-topbar .hsc-meta{flex:1;min-width:0}
.hsc-topbar .hsc-name{font-size:17px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:6px}
.hsc-topbar .hsc-line{font-size:12.5px;color:var(--hsc-muted);display:flex;align-items:center;gap:8px;margin-top:3px;flex-wrap:wrap}
.hsc-dot{width:7px;height:7px;border-radius:50%;background:var(--hsc-green);box-shadow:0 0 0 3px rgba(34,197,94,.25);display:inline-block}
.hsc-dot.hsc-warn{background:#f59e0b;box-shadow:0 0 0 3px rgba(245,158,11,.25);animation:hsc-blink 1s infinite}
@keyframes hsc-blink{50%{opacity:.35}}
.hsc-timer{font-variant-numeric:tabular-nums;font-weight:600;color:#fff}
.hsc-icon-btn{width:40px;height:40px;border-radius:12px;border:1px solid var(--hsc-glass-b);background:var(--hsc-glass);color:#fff;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);flex:none}
.hsc-icon-btn svg{width:20px;height:20px}
.hsc-q{display:inline-flex;align-items:flex-end;gap:2px;height:12px}
.hsc-q i{width:3px;border-radius:1px;background:rgba(255,255,255,.3)}
.hsc-q i:nth-child(1){height:4px}.hsc-q i:nth-child(2){height:7px}.hsc-q i:nth-child(3){height:10px}.hsc-q i:nth-child(4){height:12px}
.hsc-q[data-q="4"] i,.hsc-q[data-q="3"] i:nth-child(-n+3),.hsc-q[data-q="2"] i:nth-child(-n+2),.hsc-q[data-q="1"] i:nth-child(1){background:#4ade80}
.hsc-q[data-q="2"] i:nth-child(-n+2){background:#facc15}.hsc-q[data-q="1"] i:nth-child(1){background:#f87171}
.hsc-badge-mute{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:rgba(239,68,68,.9);flex:none}
.hsc-badge-mute svg{width:12px;height:12px}

.hsc-controls{position:absolute;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 22px);transform:translateX(-50%);display:flex;gap:14px;align-items:center;padding:12px 16px;border-radius:999px;background:rgba(15,23,42,.55);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4);z-index:4;transition:opacity .3s ease,transform .3s ease;max-width:calc(100% - 24px)}
.hsc-controls .hsc-btn{width:54px;height:54px}.hsc-controls .hsc-btn svg{width:24px;height:24px}
.hsc-controls .hsc-btn.hsc-red{width:68px;border-radius:999px}
.hsc-hide .hsc-topbar{opacity:0;transform:translateY(-12px);pointer-events:none}
.hsc-hide .hsc-controls{opacity:0;transform:translate(-50%,16px);pointer-events:none}
.hsc-tip{position:absolute;bottom:100%;left:50%;transform:translate(-50%,-8px);background:#0f172a;color:#fff;padding:5px 9px;border-radius:8px;font-size:11.5px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s}
.hsc-controls .hsc-btn{position:relative}
.hsc-controls .hsc-btn:hover .hsc-tip{opacity:1}
@media (hover:none){.hsc-tip{display:none}}

/* Local PiP */
.hsc-pip{position:absolute;width:112px;height:160px;border-radius:18px;overflow:hidden;background:#1e293b;box-shadow:0 18px 40px -10px rgba(0,0,0,.65);border:2px solid rgba(255,255,255,.22);z-index:5;touch-action:none;cursor:grab;transition:left .28s cubic-bezier(.2,.8,.2,1),top .28s cubic-bezier(.2,.8,.2,1),width .2s,height .2s}
.hsc-pip.hsc-drag{transition:none;cursor:grabbing}
.hsc-pip video{width:100%;height:100%;object-fit:cover}
.hsc-mirror{transform:scaleX(-1)}
.hsc-pip .hsc-camoff{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:#1e293b;color:var(--hsc-muted)}
.hsc-pip .hsc-camoff svg{width:28px;height:28px}
.hsc-pip.hsc-nocam .hsc-camoff{display:flex}
.hsc-pip .hsc-swap{position:absolute;right:6px;bottom:6px;width:26px;height:26px;border-radius:8px;background:rgba(15,23,42,.55);display:grid;place-items:center;border:0;color:#fff;cursor:pointer}
.hsc-pip .hsc-swap svg{width:14px;height:14px}
@media (min-width:900px){.hsc-pip{width:220px;height:140px}.hsc-pip.hsc-portrait{width:120px;height:170px}}

/* Audio call view */
.hsc-audio{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;z-index:2;padding:24px;text-align:center}
.hsc-audio .hsc-avatar{width:148px;height:148px;font-size:50px}
.hsc-avatar-wrap{margin-bottom:22px;border-radius:50%}
.hsc-vad{position:absolute;inset:-14px;border-radius:50%;background:radial-gradient(circle,rgba(129,140,248,.0) 55%,rgba(129,140,248,.45) 70%,rgba(20,184,166,0) 72%);transform:scale(1);transition:transform .12s ease-out;pointer-events:none}

/* Banners & toasts */
.hsc-banner{position:absolute;left:50%;top:calc(env(safe-area-inset-top,0px) + 86px);transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:10px 16px;border-radius:14px;background:rgba(15,23,42,.78);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);font-size:13.5px;font-weight:600;z-index:6;max-width:calc(100% - 32px);animation:hsc-drop .25s ease}
.hsc-banner.hsc-warn{border-color:rgba(245,158,11,.5)}
@keyframes hsc-drop{from{opacity:0;transform:translate(-50%,-8px)}}
.hsc-spin{width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;animation:hsc-rot .8s linear infinite;flex:none}
@keyframes hsc-rot{to{transform:rotate(360deg)}}

/* End / info sheet */
.hsc-sheet{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:8;padding:24px;background:rgba(2,6,23,.45);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.hsc-card{background:rgba(15,23,42,.88);border:1px solid rgba(255,255,255,.12);border-radius:24px;padding:28px 24px;max-width:360px;width:100%;text-align:center;box-shadow:0 30px 70px -20px rgba(0,0,0,.7);animation:hsc-pop .3s cubic-bezier(.2,.9,.3,1.2)}
@keyframes hsc-pop{from{opacity:0;transform:scale(.92)}}
.hsc-card .hsc-ic{width:64px;height:64px;border-radius:20px;margin:0 auto 14px;display:grid;place-items:center;background:rgba(239,68,68,.16);color:#fca5a5}
.hsc-card .hsc-ic.hsc-ok{background:rgba(34,197,94,.16);color:#86efac}
.hsc-card .hsc-ic.hsc-info{background:rgba(17,81,171,.2);color:#BBD3F2}
.hsc-card .hsc-ic svg{width:30px;height:30px}
.hsc-card h3{margin:0 0 6px;font-size:19px}
.hsc-card p{margin:0 0 18px;color:var(--hsc-muted);font-size:14px;line-height:1.5}
.hsc-card .hsc-row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.hsc-card .hsc-btn.hsc-wide{height:46px;font-size:14px}
.hsc-card .hsc-btn.hsc-prim{background:var(--hsc-primary);border-color:var(--hsc-primary)}

/* Self preview while ringing (caller) */
.hsc-selfprev{position:absolute;inset:0;object-fit:cover;opacity:.42;filter:saturate(1.1)}

/* Minimized floating window */
.hsc-root.hsc-min{inset:auto;right:14px;bottom:calc(env(safe-area-inset-bottom,0px) + 86px);width:124px;height:172px;border-radius:20px;box-shadow:0 22px 50px -14px rgba(2,6,23,.65);border:2px solid rgba(255,255,255,.9);cursor:pointer;touch-action:none;animation:hsc-pop .25s ease}
.hsc-root.hsc-min .hsc-topbar,.hsc-root.hsc-min .hsc-controls,.hsc-root.hsc-min .hsc-pip,.hsc-root.hsc-min .hsc-banner,.hsc-root.hsc-min .hsc-audio .hsc-name,.hsc-root.hsc-min .hsc-audio .hsc-sub,.hsc-root.hsc-min .hsc-ph small{display:none}
.hsc-root.hsc-min .hsc-audio .hsc-avatar,.hsc-root.hsc-min .hsc-ph .hsc-avatar{width:64px;height:64px;font-size:22px;margin:0}
.hsc-mini{display:none;position:absolute;left:0;right:0;bottom:0;padding:8px;background:linear-gradient(180deg,transparent,rgba(2,6,23,.85));align-items:center;justify-content:space-between;z-index:7}
.hsc-root.hsc-min .hsc-mini{display:flex}
.hsc-mini span{font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
.hsc-mini button{width:30px;height:30px;border-radius:50%;border:0;background:var(--hsc-red);color:#fff;display:grid;place-items:center;cursor:pointer}
.hsc-mini button svg{width:15px;height:15px}

/* Permission help */
.hsc-steps{text-align:left;font-size:13.5px;color:var(--hsc-muted);margin:0 0 18px;padding-left:18px;line-height:1.6}

@media (max-width:420px){.hsc-controls{gap:10px;padding:10px 12px}.hsc-controls .hsc-btn{width:50px;height:50px}.hsc-controls .hsc-btn.hsc-red{width:62px}.hsc-name{font-size:23px}.hsc-actions{gap:48px}}
@media (prefers-reduced-motion:reduce){.hsc-pulse::before,.hsc-pulse::after,.hsc-pulse>i,.hsc-btn.hsc-accept-anim{animation:none}}
