🔥 Huge style refactoring by using SvelteKit built-in style tag

It's been tricky but got there finally! Hello `:global`
- Avoid using one global CSS file containing everything
- Import the component SCSS file in a script tag from the component file to allow style scoping and including it only when used

src/components/organisms/InteractiveGlobe.svelte

@@ -1,3 +1,7 @@
+<style lang="scss">
+    @import "../../style/modules/globe";
+</style>
+
 <script lang="ts">
     import { onMount, onDestroy, getContext } from 'svelte'
     import { getPosition, getRandomItem } from '$utils/functions'
@@ -123,7 +127,7 @@
 
 <section id="globe">
     {#if type === 'cropped'}
-        <div class="globe--cropped">
+        <div class="globe-cropped">
             <div class="globe" bind:this={globeEl} />
         </div>
     {:else}