Behavior of :deep syntax in <style lang='less' scoped> differs from Webpack implementation

[ununian]

// app.vue
<template>
  <div class="content">
    <Com />
  </div>
</template>
<script setup lang="ts">
import Com from './Com.vue';
</script>

<style scoped lang="less">
.content {
   :deep(.Com) {
    &-title {
      font-size: 3rem;
    }
  }
}
</style>

// Com.vue
<template>
  <div class="Com">
    <div class="Com-title">Component</div>
  </div>
</template>

Expected .Com-title to have font-size: 3rem, but the style doesn't penetrate when using Vue's recommended :deep(x) syntax. However, using ::v-deep works normally.

https://github.com/ununian/less-deep-demo

::v-deep

:deep()