[O] Migrate sass import

AquaNet/src/components/CommunityCard.svelte

@@ -17,13 +17,13 @@
 </div>
 
 <style lang="sass">
-  @import '../vars'
+  @use '../vars'
 
   .action-card
     overflow: hidden
     padding: 1rem
-    border-radius: $border-radius
-    box-shadow: 0 5px 5px 1px $c-shadow
+    border-radius: vars.$border-radius
+    box-shadow: 0 5px 5px 1px vars.$c-shadow
     transition: all 0.2s ease
     cursor: pointer
     position: relative
@@ -32,7 +32,7 @@
     filter: drop-shadow(0 0 12px rgba(var(--card-color), 0))
 
     &:hover
-      box-shadow: 0 0 0.5rem 0.2rem $c-shadow
+      box-shadow: 0 0 0.5rem 0.2rem vars.$c-shadow
       transform: translateY(-3px)
 
       // Drop shadow glow
@@ -57,6 +57,6 @@
       mask-image: linear-gradient(45deg, transparent 30%, rgba(255,255,255,0.5) 70%, white 100%)
       opacity: 0.8
 
-      @media (max-width: $w-mobile)
+      @media (max-width: vars.$w-mobile)
         opacity: 0.6
 </style>