Fix carousel wrapper spacing and carousel dots paddings (#1258)

src/shared/components/Carousel/Carousel.style.ts

@@ -59,7 +59,7 @@ export const Track = styled.div`
 `
 
 export const Dots = styled.div`
-  padding: ${sizes(5.5)} 0;
+  padding: ${sizes(3.5)} 0;
   margin-top: ${sizes(12)};
   display: none;
 
@@ -68,10 +68,11 @@ export const Dots = styled.div`
   }
 
   .glider-dot {
+    width: 36px;
+    height: 20px;
     background-color: transparent;
-    width: ${sizes(10)};
     border-radius: 0;
-    padding: ${sizes(1)};
+    padding: ${sizes(2)} ${sizes(0.5)};
     margin: 0;
 
     &::after {

src/shared/components/RankingNumberTile/RankingNumberTile.style.ts

@@ -62,6 +62,7 @@ export const RankingNumber = styled.div<RankingNumberProps>`
 `
 
 export const ChildrenWrapper = styled.div`
+  align-self: baseline;
   --ranking-number-gap: 48px;
 
   width: calc(100% - var(--ranking-number-gap));