How to include external css in Svelte Custom Element?

I’m new to Svelte and I’m trying to create a custom element that relies on font-awesome fonts. However, when I build the component and try to use it — none of my styling (including the font-awesome css) gets applied.

I really don’t want the user of my element to have to include font-awesome on their own — I want it to just be included as part of my custom element.

Just curious what I need to do to get this to work?

Here’s what I have:

App.js

<svelte:options customElement="my-custom-element"></svelte:options> 

<script>
   export let overrideCss = null;  //Give user of element chance to override css
   ...
</script>

<!-- Css below is applied when running dev server, but doesn't get applied after build -->
<link rel="stylesheet" href="/src/app.css">
<link href="./../node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"> 
{#if overrideCss}
    <link rel="stylesheet" href={overrideCss}/>
{/if}

<div id="my-app-container">
  ...
  <i class="fas fa-thumbs-{approved ? 'up' : 'down'}"></i>
</div>