Почему не работают CSS-стили для SVG-спрайта?

Столкнулся с проблемой при стилизации SVG-спрайтов - спрайт не воспринимает стили. Для примера я взял один и тот же SVG-логотип и дважды добавил его на страницу - обычным inline-способом и через SVG-спрайт. Задал одинаковые стили для обоих SVG. В результате на одном SVG стили применяются, на другом (который из SVG-спрайта) - нет.

https://codepen.io/vegas-host/pen/BaJJarb

Дублирую код здесь:

// PUG
// SVG sprite
svg(width='0' height='0')
    symbol(id='logo_icon')
        circle(cx='20.5' cy='20.5' r='20.5')
        path(d='M19.344 31V15.426H13.286V12.67H28.756V15.426H22.698V31H19.344Z')

// Some code
.logo
    .svg_inline
        // SVG inline
        svg
            circle(cx='20.5' cy='20.5' r='20.5')
            path(d='M19.344 31V15.426H13.286V12.67H28.756V15.426H22.698V31H19.344Z')
        | Inline
    .svg_sprite
        // SVG from sprite
        svg
            use(xlink:href='#logo_icon')
        | Sprite

// SCSS
.logo {    
    .svg_inline, .svg_sprite {
        display: flex;
        align-items: center;
        
        svg {
            width: 41px;
            height: 41px;
            margin: 5px;
            circle { fill: plum; }
            path { fill: fuchsia; }
        }
    }
}

Читал, что при использовании SVG-спрайтов изображение уходит в shadow DOM и там внешние стили просто недоступны, что есть разные варианты их, эти стили, туда внедрить, но у меня ничего не получилось. Я даже пробовал какие-то магические для меня комбинации с символами :: и >>>. Бесполезно.

Прошу опытных коллег посмотреть пример кода и подсказать, как применить стили к SVG-спрайту.