fix: 💄 border-radius affects svg icon

src/components/timeline.webc

@@ -1,6 +1,6 @@
 <ul webc:root="override">
   <li class="job" webc:for="job of jobs">
-    <icon class="icon" :icon="job.icon"></icon>
+    <div class="icon"><icon :@icon="job.icon"></icon></div>
     <p class="title" @text="job.title"></p>
     <p class="text" @text="job.desc"></p>
   </li>
@@ -19,7 +19,6 @@
     @media (min-width: 32em) {
       --timeline-circle-size: 4rem;
     }
-
   }
 
   :host .job {
@@ -28,7 +27,6 @@
       'icon title'
       'line text';
     column-gap: 1em;
-
   }
 
   :host .job::before {
@@ -55,7 +53,7 @@
     height: 50%;
   }
 
-  :host .icon {
+  :host .job > .icon {
     grid-area: icon;
     align-self: center;