.call-btn-header {
    background: none; border: none; cursor: pointer; color: var(--vk-text-secondary);
    width: 36px; height: 36px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
    transition: background .15s, color .15s;
}
.call-btn-header:hover { background: var(--vk-input-bg); color: #4caf50; }
.call-btn-header svg { width: 20px; height: 20px; }

.call-ui {
    position: fixed; left: 50%; top: 12px; transform: translateX(-50%);
    z-index: 100000; width: min(420px, calc(100vw - 20px));
    display: flex; align-items: center; gap: 12px; padding: 12px 14px;
    background: #1c1c24; color: #fff; border-radius: 18px;
    box-shadow: 0 10px 40px rgba(0,0,0,.45);
    animation: callIn .25s ease;
}
@keyframes callIn { from { opacity: 0; transform: translate(-50%, -16px); } to { opacity: 1; transform: translate(-50%, 0); } }
.call-ava { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.call-info { flex: 1; min-width: 0; }
.call-name { font-weight: 600; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.call-status { font-size: 13px; color: #aab; margin-top: 2px; font-variant-numeric: tabular-nums; }
.call-btns { display: flex; gap: 8px; }
.call-b {
    width: 44px; height: 44px; border-radius: 50%; border: none; cursor: pointer;
    font-size: 18px; color: #fff; display: flex; align-items: center; justify-content: center;
    transition: transform .12s, filter .15s;
}
.call-b:active { transform: scale(.92); }
.call-accept { background: #4caf50; animation: callPulse 1.2s infinite; }
.call-reject { background: #f44336; }
.call-mute { background: #3a3a48; }
.call-mute.on { background: #fff; color: #000; }
@keyframes callPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(76,175,80,.6); } 50% { box-shadow: 0 0 0 10px rgba(76,175,80,0); } }